用animate写的动画效果，图片幻灯切换

最新推荐文章于 2022-11-22 17:57:50 发布

weixin_33811961

最新推荐文章于 2022-11-22 17:57:50 发布

阅读量280

点赞数

文章标签： python javascript ViewUI

原文链接：https://my.oschina.net/robbinwilliam/blog/192801

版权

2019独角兽企业重金招聘Python工程师标准>>>

原文：http://www.xbonline.net/archives/4

效果图：

运行代码

jquery代码：

$(function(){        var page=1;        var i=4;        $("span.next").click(function(){            var $parent=$(this).parents("div#image_slide");            var $v_show=$parent.find("div.yx_content_list");            var $v_content=$parent.find("div.yx_content");             var v_width=$v_content.width();            var len=$v_show.find("li").length;            var page_count=Math.ceil(len/i);            if(!$v_show.is(":animated")){                if(page==page_count){                    $v_show.animate({left:'0px'},"slow");                    page=1;                }else{                    $v_show.animate({ left:'-=' + v_width },"slow");                    page++;                }            }            $parent.find(".hightlight_tip span").eq((page-1)).addClass("current")            .siblings().removeClass("current");         });        $("span.prev").click(function(){            var $parent=$(this).parents("div#image_slide");            var $v_show=$parent.find("div.yx_content_list");            var $v_content=$parent.find("div.yx_content");             var v_width=$v_content.width();            var len=$v_show.find("li").length;            var page_count=Math.ceil(len/i);            if(!$v_show.is(":animated")){                if(page==1){                    $v_show.animate({left:'-='+v_width*(page_count-1)},"slow");                    page=page_count;                }else{                    $v_show.animate({ left:'+=' + v_width },"slow");                    page--;                }            }            $parent.find(".hightlight_tip span").eq((page-1)).addClass("current")            .siblings().removeClass("current");        });    })

转载于:https://my.oschina.net/robbinwilliam/blog/192801