码迷,mamicode.com
首页 > 其他好文 > 详细

轮播代码

时间:2016-08-02 20:58:21      阅读:167      评论:0      收藏:0      [点我收藏+]

标签:

var i = 0;
var timer = null;
$(function(){
    $(".slider_ul").find("li").eq(0).show().siblings().hide();
    showTime();
    $(".focus_btn").find("li").hover(function(){
        //获取到当前鼠标所在的下标的索引
        i = $(this).index();
        show();
        //鼠标放上去之后,怎么停止呢?获取到变量的过程,清除轮播,把变量传进去
        clearInterval(time);
    },function(){
         showTime();
    });
});

function show() {
    $(".slider_ul").find("li").eq(i).fadeIn(300).siblings().fadeOut();
    $(".focus_btn").find("span").eq(i).addClass("on").siblings().removeClass("on");
}
function showTime()
{
    timer = setInterval(function () {
        i++;
        if (i == 4) {
            //只有4张图片,所以i不能超过4,如果i等于4时,我们就让它等于第一张
            i = 0;
        }
        show();
    }, 3000);
}

 

轮播代码

标签:

原文地址:http://www.cnblogs.com/vscss/p/5730466.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!