Heim >Web-Frontend >js-Tutorial >jQuery animate(滑块滑动效果代码)_jquery

jQuery animate(滑块滑动效果代码)_jquery

WBOY
WBOYOriginal
2016-05-16 18:37:351395Durchsuche
jQuery animate(滑块滑动效果代码)_jquery
HTML
复制代码 代码如下:


CSS
复制代码 代码如下:





JavaScript
复制代码 代码如下:

$(document).ready(function(){
$(".run").click(function(){

$("#box").animate({opacity: "0.1", left: "+=400"}, 1200)
.animate({opacity: "0.4", top: "+=160", height: "20", width: "20"}, "slow")
.animate({opacity: "1", left: "0", height: "100", width: "100"}, "slow")
.animate({top: "0"}, "fast")
.slideUp()
.slideDown("slow")
return false;

});
});


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn