Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

来源：动视网责编：小采时间：2020-11-27 20:42:17

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧: ul { padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px } #announcement { width:100%; background:url(img/menu_bg.gif) repeat; overflow: hidden; } #announcement div { border: #e6e6e6 1px solid; p

推荐度：

点击下载本文 文档为doc格式

导读Discuz公告效果（自动换行，无间隙滚动）_javascript技巧: ul { padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px } #announcement { width:100%; background:url(img/menu_bg.gif) repeat; overflow: hidden; } #announcement div { border: #e6e6e6 1px solid; p

<HTML xmlns="http://www.w3.org/1999/xhtml"> 
<HEAD> 
<TITLE></TITLE> 
<META http-equiv=Content-Type content="text/html; charset=gbk"> 
<style type="text/css"> 
ul { 
 padding-right: 0px; 
 padding-left: 0px; 
 padding-bottom: 0px; 
 margin: 0px; 
 padding-top: 0px 
} 
#announcement { 
 width:100%; 
 background:url(img/menu_bg.gif) repeat; 
 overflow: hidden; 
} 
#announcement div { 
 border: #e6e6e6 1px solid; 
 padding:0px 10px 0px 10px; 
 overflow-y:hidden; 
 line-height: 24px; 
 height: 24px 
} 
#announcement li { 
 font-size: 12px; 
 float: left; 
 list-style-type: none; 
 margin-right: 20px; 
 padding-left: 10px; 
 background: url(img/arrow_right.gif) no-repeat 0px 50%; 
 white-space: nowrap 
} 
#announcement a { 
 text-decoration: none; 
} 
#announcement a:hover { 
 text-decoration:underline; 
} 
</style> 
</HEAD> 
<BODY> 
 
 
 
<LI>分享个表单验证函数（2008-12-16 05:30 P.M.）</LI> 
<LI>块级元素和级联元素的含义（2008-12-13 03:39 P.M.）</LI> 
<LI>如何设置的width属性且不换行？？（2008-12-13 03:23 P.M.）</LI> 
<LI>执行javascript后，gif动画就静止了？？（2008-12-13 03:12 P.M.）</LI> 
<LI>基于栅格地图的查询系统（切片缓存技术）（2008-11-29 07:38 P.M.）</LI> 
<LI>【转】flash和javascript之间的通讯（javascript调用flash中的函数）（2008-11-27 07:45 P.M.）</LI> 
<LI>不使用循环和回调函数</pre>输出字符1~100（2008-11-23 03:00 P.M.）</LI> 
<LI>简洁的js图片等比缩放（2008-11-22 04:54 P.M.）</LI> 
<LI>分贝网音乐地址获取器（2008-11-20 05:19 P.M.）</LI> 
 
 
 
 
function $(id) 
{ 
return document.getElementById(id); 
} 
var anndelay = 3000; 
var anncount = 0; 
var annheight = 24; 
var annst = 0; 
function announcementScroll() 
{ 
if( ! annst) 
{ 
$('announcementbody').innerHTML += '<br style="clear: both" />' + $('announcementbody').innerHTML; 
$('announcementbody').scrollTop = 0; 
if($('announcementbody').scrollHeight > annheight * 3) 
{ 
annst = setTimeout('announcementScroll()', anndelay); 
} 
else 
{ 
$('announcement').onmouseover = $('announcement').onmouseout = null; 
} 
return; 
} 
if(anncount == annheight) 
{ 
if($('announcementbody').scrollHeight - annheight <= $('announcementbody').scrollTop) 
{ 
$('announcementbody').scrollTop = $('announcementbody').scrollHeight / 2 - annheight; 
} 
anncount = 0; 
annst = setTimeout('announcementScroll()', anndelay); 
} 
else 
{ 
$('announcementbody').scrollTop ++ ; 
anncount ++ ; 
annst = setTimeout('announcementScroll()', 10); 
} 
} 
announcementScroll(); 
</ script> 
</BODY> 
</HTML>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签：技巧公告 discuz

热门焦点

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

Discuz公告效果（自动换行，无间隙滚动）_javascript技巧

最新推荐

猜你喜欢

热门推荐