jquery cycle pugin

插件地址: http://jquery.malsup.com/cycle/

<div id="propaganda">
<div id="pgdImg">
<span id="arrow1" ><img src="images/pgd/arrow1.png" /></span>
<span id="arrow2"><img src="images/pgd/arrow2.png" /></span>

<div id="ads">

</div>
</div>

$(function(){

$.getJSON('data/promo.json', {}, function(data){

var len=data.promo.length;
var promoStr="";
for(var i=0; i<len; i++)
{
var img=data.promo[i].imgPath;
var title=data.promo[i].title;
var linkUrl=data.promo[i].linkURL;
//promoStr+="<div><a href="_story/story_1.html" target="_story" onclick="slideDownAtIndex(1,true)" ><img src=""+img+""/></a><div class="opacityBG"></div><div class="adsFont"><div onclick="slideDownAtIndex(1,true)">"+title+"</div> <div><a class="moreInfo" href="_story/story_1.html" target="_story" onclick="slideDownAtIndex(1,true)">更多資料>></a></div></div></div>";
promoStr+="<div><a href="_story/story_1.html" target="_story" onclick="slideDownAtIndex(1,true)" ><img src=""+img+""/></a><div class="opacityBG"></div><div class="adsFont"><div class="bTitle" onclick="slideDownAtIndex(1,true)">"+title+"</div> <div class="moreInfo">更多資料>></div></div></div>";
}

$("#ads").html(promoStr);

$('#ads').cycle({
fx: 'fade',
speed: 1000,
timeout: 4000,
pause:1,
// nowrap: 1,
pager: '#pagerBar',
next: '#arrow2',
prev: '#arrow1',
//before: onAfter,
pagerAnchorBuilder: function(idx, slide) {
var num=parseInt(idx)+1;
return '<a href="#" class="NOTactiveSlide">'+num+'</a>';
},
pauseOnPagerHover:true

});

});

})