1. 图片轮播所需js
// JavaScript Document
var t = 0;
var n = 0;
var count = 0;
//需要延迟加载
setTimeout(function(){
count = $("#play_list a").size();
$("#play_list a:not(:first-child)").hide();
$("#play_info").html($("#play_list a:first-child").find("img").attr('alt'));
$("#play_text li:first-child").css({"background":"#fff",'color':'#000'});
$("#play_info").click(function(){window.open($("#play_list a:first-child").attr('href'), "_blank");});
$("#play_text li").click(function() {
var i = $(this).text() - 1;
n = i;
if (i >= count){
return;
}
$("#play_info").html($("#play_list a").eq(i).find("img").attr('alt'));
$("#play_info").unbind().click(function(){window.open($("#play_list a").eq(i).attr('href'), "_blank");});
$("#play_list a").filter(":visible").fadeOut(1000).parent().children().eq(i).fadeIn(1000);
$(this).css({"background":"#fff",'color':'#000'}).siblings().css({"background":"#000",'color':'#fff'});
});
t = setInterval("showAuto()", 2000);
$("#play").hover(function(){clearInterval(t);}, function(){t = setInterval("showAuto()", 2000);});
},1500);
function showAuto()
{
n = n >= (count - 1) ? 0 : n + 1;
$("#play_text li").eq(n).trigger('click');
}
2. 页面调用
<div id="picture">
<div id="play">
<div id="play_bg" class="scrollDiv">
<div id="play_info"></div>
<div id="play_text">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</div>
<div id="play_list">
</div>
</div>
</div>