Discuz 公告效果（自动换行，无间隙滚动）- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Discuz 公告效果（自动换行，无间隙滚动）

Javascript: javascript中的有名函数和无名函数; javascript[js]获取url参数的代码; javascript select 之间传值效果的代码; js正则实现的密码框简单制作,还可以替换成自己想用得符号; 脚本控制自适应高度的缩短问题; 兼容ie和firefox版本的js反选全选多选框; javascript 随机数与高级应用附vbscript(asp) 随机数总结; 不用确认即可打印的javascript代码; 推荐自用 Javascript 缩图函数 (onDOMLoaded)……; 用javascript实现div可编辑的常见方法; 用JavaScript实现的一个IP地址输入框; 用javascript取得传递参数的个数的代码; 当鼠标移出灰色区域时候,菜单项怎么隐藏起来; 才发现的超链接js导致网页中GIF动画停止的解决方法; javascript window.onerror事件学习新收获; javascript 如何生成不重复的随机数; 超个性的导航效果; 不能再简单的无闪刷新验证码原理很简单; 经常用到的javascript验证函数收集; 用js实现手把手教你月入万刀(转贴)

No. « ‹ 85 86 87 88 › »

技术文章搜索

关键字

Javascript 中的 Discuz 公告效果（自动换行，无间隙滚动）

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 326 ::

收藏到网摘: n/a

js GridView 实现自动计算操作代码 js 动态添加标签（新增一行，其实很简单，就是几个函数的应用）

Discuz 公告效果效果代码，可以自动换行和无间隙滚动

点击运行可以看到效果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<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>
<DIV id=announcement onMouseOver="if(!anncount) {clearTimeout(annst);annst = 0}" onMouseOut="if(!annst) annst = setTimeout('announcementScroll()', anndelay);">
<DIV id=announcementbody>
<UL>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/0f4ab6defbf1b65fccbf1ada.html" target="_blank">分享个表单验证函数</A>（2008-12-16 05:30 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/d6b9543ddf2739e93d6d9798.html" target="_blank">块级元素和级联元素的含义</A>（2008-12-13 03:39 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/5cc8a31ed1749d1841341796.html" target="_blank">如何设置<span>的width属性且不换行？？</A>（2008-12-13 03:23 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/11bf1b174322d9064a90a788.html" target="_blank">执行javascript后，gif动画就静止了？？</A>（2008-12-13 03:12 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/67424f901f46308aa977a4f5.html" target="_blank">基于栅格地图的查询系统（切片缓存技术）</A>（2008-11-29 07:38 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/b5230933b495d5ff1b4cff78.html" target="_blank">【转】flash和javascript之间的通讯（javascript调用flash中的函数）</A>（2008-11-27 07:45 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/07bad22a214e132ad42af106.html" target="_blank">不使用循环和回调函数输出字符1~100</A>（2008-11-23 03:00 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/acc8421005e1fbfbc2ce795a.html" target="_blank">简洁的js图片等比缩放</A>（2008-11-22 04:54 P.M.）</LI>
<LI><A href="http://hi.baidu.com/mimimo/blog/item/2940948f875a27fd503d9265.html" target="_blank">分贝网音乐地址获取器</A>（2008-11-20 05:19 P.M.）</LI>
</UL>
</DIV>
</DIV>
<script type="text/javascript">
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 GridView 实现自动计算操作代码 js 动态添加标签（新增一行，其实很简单，就是几个函数的应用）

Javascript 中的 Discuz 公告效果（自动换行，无间隙滚动）

评论 (0) All