让文字不间断横向滚动(不使用marquee标签)

如题： 
页面如下 ：发货公告:   |    湖北小张 货已发 顺风快递      广西王先生货已发 EMS 宅急送          广东孙小姐货已发 黑体加粗部分为 发货信息
要求发货信息循环滚动， 当滚动到 |  时 就隐藏， 如何实现？

解决方案 »

  1.   

    本来想插入一张效果图进来，但 N 麻烦 ，CSDN 图片插入功能 麻烦的很
      

  2.   

    <!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>
        <title>Untitled Page</title>
        <script language="javascript" type="text/javascript">
            var x = 100;
            function hide() {
                if (x <= -600)
                    x = 100;
                document.getElementById("msg").style.left = x + "px";
                x -= 10;
                setTimeout("hide()", 500);
            }
            window.onload = hide;
        </script>
    </head>
    <body><div>
        <div style="float:left; z-index:999; background-color:red;">发货公告: |</div>
        <div id="msg" style="font-weight:bold; position:absolute; left:100px; z-index:1;"> 
            湖北小张 货已发 顺风快递 广西王先生货已发 EMS 宅急送 广东孙小姐货已发
        </div></div>
    </body>
    </html>
      

  3.   

    z-index是可以隐藏的，这个我就不是很清楚了，我也算是初学者。
      

  4.   

    一般用scrollLeft属性结合setTimeout就可以实现了