jquery图片自动轮播怎么设置?求高手

2025-05-06 03:59:51
推荐回答(1个)
回答1:




yugi


#pic {
width: 410px;
height: 200px;
margin: 0 auto;
margin-top: 150px;
}

#pic #po {
width: 370px;
overflow: hidden;
height: 170px;
left: 20px;;
top: 10;
position: relative;
}

#pic #pol {
width: 2370px;
height: 165px;
position: absolute;
}

#pic #num {
width: 120px;
height: 25px;
position: absolute;
z-index: 2;
left: 247px;
top: 140px;
}

#pic #num span {
width: 10px;
margin-left: 10px;
cursor: pointer;
font-size: 12px;
height: 20px;
float: left;
color: #000000;
text-align: center;
}

#pic #num span.cut {
background: #000000;
color: #FFFFFF;
}

img {
width: 370px;
height: 165px;
float: left
}



jQuery (function ($)
    {
var CRT = 0;
    var w = $ ("img").width (), pol = $("#pol"), spans = $ ("#num span");
    spans.hover (function ()
    {
    var me = $ (this);
    me.addClass ("cut").siblings (".cut").removeClass ("cut");
    spans.eq(CRT).clearQueue();
    pol.stop ().animate (
    {
    left : "-" + w * (CRT = me.index ()) + "px"
    }, "slow");
    }, function()
    {
     anony();
    });
    
    var anony = function ()
    {
     CRT++;
     CRT = CRT > spans.length - 1 ? 0 : CRT;
     spans.eq(CRT).clearQueue().delay(1000).queue (function()
     {
     spans.eq(CRT).triggerHandler ("mouseover");
     anony();
     });
    };
    
    anony();
    });






 
 
 
 



 1 
2 
3 
4 
5




相关问答
最新问答