transform,mask,transitionend

它拿这破本在想东西,
想着有一天会开飞机。
满脑子里想着金钱,
还在这里游手好闲。
他说自己耳眼不好,
我在这里为他祈祷。


干了这碗毒鸡汤: 只要你每天坚持自习,认真刻苦,态度端正,忍受孤独,最终的胜利肯定是属于那些考场上发挥好的人。


蒙版

    -webkit-mask
        显示有颜色的地方

transform

    rotate()                Z轴旋转
    rotateX()               X轴旋转
    rotateY()               Y轴旋转
    透视
    transform: perspective(透视值); 
            值   推荐800-1200
                大   不明显
                小   明显
    translate(x,y)          x轴y轴平移
    translateZ()            Z轴平移
    想要改变translateZ,那父级元素必须变成3D
        -webkit-transform-s tyle: preserve-3d;
        父级一定要透视
        如果父级有旋转XY之类的
        -webkit-transform: perspective() rotateX/Y();
        如果父级什么都不需要
        perspective: 800px;
    transform注意:
        1.执行有顺序(后面的先执行)
        2.行元素有问题(不能操作行元素)

transitionend事件

        当transition运动结束后触发
        必须用addEventListener添加
        xxx.addEventListener('transitionend',tranEnd,false);
transform,mask,transitionend_第1张图片
可爱吗

你可能感兴趣的