关闭边栏(ESC)打开边栏(ESC)
目 录
公告效果一直只有向上滚动，没有淡入淡出的效果，也没有鼠标经过时的暂时停效果，今天就把它改了，加入淡入淡出的效果与鼠标经过时的暂停效果。
内容的结构：
内容通过数据查询出来后，放在列表li中，每条信息就是一个li。主题自了向上滚动的效果，原理也好简单，就是通过向上移动top的值来位移Li，就能达到向上滚动的效果。淡入淡出的效果就要每次取得一个li，其余的隐藏。
JS中写入以下代码：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
//公告：加入淡入淡出效果 var noticeN=1; //这里设为1，是为了适合向上滚动；默认就显示第一条，3s后才真正执行淡入淡出 var noticeNums = $(".notice-wrap ul li").length; function noticeCarousel() { if (noticeAnimation == "slide"){ $(".notice-wrap ul").animate({ "top": "-24px" }, 450, function () { $(this).css("top", 0); $(this).append($(this).find("li:first")); }); }else{ if (noticeN>noticeNums-1){ noticeN=0; } $(".notice-wrap li").eq(noticeN).fadeIn(700).siblings().fadeOut(); noticeN++; } } //二条以上公告时才执行滚动 if (noticeNums > 1) { noticecount=setInterval(noticeCarousel, 3000) } //鼠标over时暂停 $(".notice-wrap ul").hover(function(){ clearInterval(noticecount); },function(){ if (noticeNums > 1) { noticecount=setInterval(noticeCarousel, 3000); } }) |
其中：noticeAnimation参数是加在主题配置中的，方便在后台选择显示效果。通过这二种效果，可以做出其它的功能，例如在首页显示最新的文章呀、置顶文章的滚动显示呀等等
