600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > php动画效果 自定义动画效果自定义动画效果

php动画效果 自定义动画效果自定义动画效果

时间:2024-02-13 10:56:38

相关推荐

php动画效果 自定义动画效果自定义动画效果

摘要:

jQuery的动画效果--自定义动画 jQuery的动画效果--自定义动画

div{width: 200px;height: 200px;background:blue;position: absolute; color: #fff;}

// jQuery中我们使用 animate()方法创建自定义的动画

// 语法:$(selector).animate({params},speed,fn);

// 必需的 params 参数定义形成动画的 CSS 属性。

// 可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

// 可选的 fn是动画完成后所执行的函数

停止动画:

stop() 方法用于停止动画或效果,在它们完成之前; 该方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画

语法:

$(selector).stop(stopAll,goToEnd)

可选的参数 stopAll 规定是否应该清除动画队列。默认是 false 仅停止活动的动画,允许任何排入队列的动画向后执行

可选的参数 goToEnd 规定是否立即完成当前动画。默认是 false

默认情况下 stop() 会清除在被选元素上指定的当前动画

$(document).ready(function(){

$('.but1').click(function(){

$('p').animate({fontSize:'40px'},1500)//属性名称font-size 一律改成驼峰写法:fontSize

})

//同时操作多个css属性

//使用预定义的值 show hide toggle

$('.but2').click(function(){

$('div').animate({

// left:'400px',//如果想对元素位置进行一个位移,那么我们需要给当前元素设置一个position例如:

// opacity:'0.3',

// height:'400px',

// width:'400px'

width:'toggle'

},1500)

})

$('#right').click(function(){

$('.box1').animate({left:'+500px'},3000)

$('.box1').animate({fontSize:'30px'},500)

})

$('#stop').click(function(){

$('.box1').stop(true)

})

})

右移

停止

php中文网

批改老师:韦小宝批改时间:-01-28 09:14:18

老师总结:写的很不错 jQuery可以实现很多的动画效果 这种都是要看自己的熟练程度了 注释写的很不错 课后要记得多练习 继续加油吧

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。