一个流行的公告Demo

 

代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>无标题页</title>
    <script type="text/javascript">
    function $(id){return document.getElementById(id);}
function startMarquee(h,speed,delay,sid)
{var t=null;var p=false;var o=$(sid);o.innerHTML+=o.innerHTML;o.onmouseover=function(){p=true}
o.onmouseout=function(){p=false}
o.scrollTop=0;function start(){t=setInterval(scrolling,speed);if(!p){o.scrollTop+=2;}}
function scrolling(){if(p)return;if(o.scrollTop%h!=0){o.scrollTop+=2;if(o.scrollTop>=o.scrollHeight/2)o.scrollTop=0;}else{clearInterval(t);setTimeout(start,delay);}}
setTimeout(start,delay);}

    </script>
    <style type="text/css">
        .top-news
        {
            width: 600px;
            float: left;
        }
        #top-news
        {
            height: 30px;
            overflow: hidden;
        }
        #top-news li
        {
            margin-left: 35px;
            height: 30px;
            line-height: 30px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div class="top-news">
        <ul id="top-news">
            <li><a href="#">这里是站点顶部公告-测试公告长度本条公告是50个字符。1</a></li>
            <li><a href="#">这里是站点顶部公告-测试公告长度本条公告是50个字符。2</a></li>
            <li><a href="#">这里是站点顶部公告-测试公告长度本条公告是50个字符。3</a></li>
            <li><a href="#">这里是站点顶部公告-测试公告长度本条公告是50个字符。4</a></li>
            <li><a href="#">这里是站点顶部公告-测试公告长度本条公告是50个字符。5</a></li>
        </ul>

        <script type="text/javascript">startMarquee(30, 10, 1500, 'top-news');</script>

    </div>
    </form>
</body>
</html>

 

这是网上比较流行的公告做法

以上代码直接复制即可使用

谢谢

posted @ 2010-02-04 12:08  我就是王子  阅读(319)  评论(0)  编辑  收藏  举报