transform:对对象属性进行动画编辑(可用于有渐变效果的动画)
一、transition:动画的过度效果
注:始终设置 transition-duration 属性,否则时长为 0,就不会产生过渡效果。
transition的属性值及其用法:
1.transition-property 规定设置过渡效果的 CSS 属性的名称。
2.transition-duration 规定动画过度需要的时间
3.transition-timing-function 动画的过度曲线
注:linear:用于相同速度开始至结束的过渡效果
4.transition-delay 动画何时开始
二、translate:动画的平移效果
属性值可加X Y Z 点的坐标
transform:translateX(50px) //向右平移50px
三、scale:动画的旋转
transform:rotate(9deg) //旋转9度
具体事例
用transform设置图片的缓慢进入
var obj=documen.getElementByClassName("classname")[0];
obj.setAttribute("class",obj.getAttribute("class")+" classname2");