`
a19905522
  • 浏览: 99186 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

JQ幻灯

    博客分类:
  • JS
 
阅读更多
<script type="text/javascript">
<!--
var n=0,num,wid;

function autoPlay() //全局函数
{
   n++
   if(n>=num) n = 0
   $(".num p").removeClass("current")
   $($(".num p")[n]).addClass("current")
    $($(".pics li")[n]).siblings().hide()
    $($(".pics li")[n]).fadeTo(0,1)
    $($(".pics p")[n]).siblings("p").hide()
    $($(".pics p")[n]).fadeTo(0,0.7)
}

$(function(){ //文档就绪
    num = $(".pics li").size() //几张图
    
    // 初始化下标
    var buf = [];
    for (var j = 0; j < num; j++) {
        buf.push("<p>" + (j + 1) + "<\/p>");
    }
    $('.num').append(buf.join(''));
    
    $(".pics p").fadeTo(0,0.7)
    $(".pics p:first").show();
    $(".pics li:first").show();
    $(".num p").css("right",function(i){return  28 * (num-i)})
    $(".num p:first").addClass("current")
    $(".num p").hover(
    function(){
       window.clearInterval(wid) //取消自动播放
       $(".num p").removeClass("current")
       $(this).addClass("current")
       n = $(this).index()
       $($(".pics li")[n]).siblings().hide()
       $($(".pics li")[n]).fadeTo(0,1)
       $($(".pics p")[n]).siblings("p").hide()
       $($(".pics p")[n]).fadeTo(0,0.7)
      },
      function(){wid = window.setInterval("autoPlay()",3000)})//鼠标划开重新启动自动播放
      wid = window.setInterval("autoPlay()",3000) // 每间隔3秒执行一次autoPlay
});
-->
</script>

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics