jquery实现炫酷的叠加层自动切换特效_jquery

下面是HTML代码：

http://www.w3.org/1999/xhtml">



http://keleyi.com/keleyi/phtml/jqtexiao/34/css/funnyNewsTicker.css">
">http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.2.min.js">>

• 
  
  1">http://domain.com">1.下面由柯乐义同学来做报告。
  
  


• 
  
  2">http://domain.com">2.这些页片会自动切换。
  
  


• 
  
  3">http://domain.com">3.切换速度可以设置。
  
  


• 
  
  4">http://domain.com">4.也可以点击向上或向下箭头控制切换。
  
  


• 
  
  5">http://domain.com">5. 也可以点击某一页片把它切到最前端。
  
  


• 
  
  6">http://domain.com">6.更多信息请访问http://domain.com" style="color:red">http://domain.com
  
  


• 
  
  7">http://domain.com">7.下面请看歌词猜歌名（3首）。
  
  


• 
  
  8">http://domain.com">8. 他说风雨中这点痛算什么
  
  


• 
  
  9">http://domain.com">9.人生可比是海上的波浪
  
  


• 
  
  10">http://domain.com">10.胆似铁打骨如金钢
  
  

" } $(this).append(i) }); $(e.modulid + " ul li .fnt-content").find("a").css({ color: e.contentlinkcolor }); $(e.modulid + " ul li").find(".fnt-info").find("a").click(function (e) { if ($(this).attr("data-type") == "facebook") { window.open("http://www.facebook.com/sharer.php?u=" + encodeURIComponent($(this).attr("data-url")) + "&t=" + encodeURIComponent($(this).attr("data-text")), "sharer", "toolbar=0,status=0,width=626,height=436"); return false } else if ($(this).attr("data-type") == "twitter") { window.open("http://twitter.com/share?text=" + $(this).attr("data-text") + "&url=" + $(this).attr("data-url"), "sharer", "toolbar=0,status=0,width=626,height=436"); return false } else if ($(this).attr("data-type") == "google") { window.open("https://plus.google.com/share?url=" + $(this).attr("data-url") + "&title=" + $(this).attr("data-text"), "sharer", "height=550,width=525,left=100,top=100,menubar=0"); return false } }); $(e.modulid + " ul li").click(function (e) { t = $(this).index(); l() }); if (e.pagenavi) { $(e.modulid).append('

http://keleyi.com/keleyi/phtml/jqtexiao/34/img/fnt-arrows-' + e.pagenavistyle + '.png) top no-repeat;">

http://keleyi.com/keleyi/phtml/jqtexiao/34/img/fnt-arrows-' + e.pagenavistyle + '.png) bottom no-repeat;">

'); $(e.modulid).css({ height: e.itemheight + 200, padding: "20px 10px", width: e.width }) } else { $(e.modulid).css({ height: e.itemheight + 160, padding: "0px 10px", width: e.width }) } o(); $(window).resize(function (e) { o() }); u(); $(e.modulid + ">div").click(function (e) { if ($(this).attr("class") == "fnt-top-arrow") a(); else f() }); if (e.autoplay) { s = setInterval(function () { f() }, e.timer); $(e.modulid).hover(function () { clearInterval(s) }, function () { s = setInterval(function () { f() }, e.timer) }) } } function u() { $.ajax({ type: "GET", url: document.location.protocol + "//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=" + e.feedcount + "&callback=?&q=" + encodeURIComponent(e.feed), dataType: "json", async: false, success: function (i) { veri = i.responseData.feed.entries; news = ""; $(veri).each(function (e, t) { if (e == 0) news = news + '

' + veri[e].title + "

"; else if (e == 1) news = news + '

' + veri[e].title + "

"; else if (e == 2) news = news + '

' + veri[e].title + "

"; else if (e == 3) news = news + '

' + veri[e].title + "

"; else if (e == veri.length - 1) news = news + '

' + veri[e].title + "

"; else if (e == veri.length - 2) news = news + '

' + veri[e].title + "

"; else if (e == veri.length - 3) news = news + '

' + veri[e].title + "

"; else news = news + '

' + veri[e].title + "

" }); $(e.modulid + " ul").html(""); $(e.modulid + " ul").append(news); n = veri.length - 1; r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3]; o() }, error: function () { $(e.modulid + " ul").html('

Error! Please try again later...

') } }) } e.modulid = "#" + $(this).attr("id"); var t = 0; var n = $(e.modulid + " ul li").length - 1; var r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3]; var i = ""; var s = e.modulid; if (e.feed != false) { $(e.modulid + " ul").html(""); $(e.modulid + " ul").append('

Rss Feed Loading...

'); u() } else { o() } }) } })(jQuery)
$(document).ready(function(){
$("#funnyNewsTicker2").funnyNewsTicker({width:"80%",timer:4000,titlecolor:"#FFF",itembgcolor:"#1faf6d",infobgcolor:"#1a935c",buttonstyle:"white",bordercolor:"#1a935c"});
$("#funnyNewsTicker3").funnyNewsTicker({width:"60%",itemheight:250,infobarvisible:false,pagenavi:false,timer:500,itembgcolor:"#af1f63",bordercolor:"#af1f63",titlecolor:"#FFF"});
});

适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.