TextBox 中上下滚动的Text

head:

<style type="text/css">
    /**//*************
    START OF DEMO CSS 
    **************/
    #ads{
        width:730px;
        margin-top:10px;    
    }
    body{
        font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;    /**//* Font to use */
        width:100%;
        height:100%;
        margin:0px;
        padding:0px;
        background-color: #E2EBED;
        text-align:center;
    }
    img{
        border:0px;
    }
    p{    
        margin-top:0px;
    }
    .clear{
        clear:both;
    }
    #mainContainer{
        width:760px;
        margin:0 auto;
        background-color:#FFF;
        border-left:1px solid #000;
        border-right:1px solid #000;
        border-bottom:1px solid #000;
        padding:10px;
        background-color:#FFF;    
        text-align:left;
            
    }
    
    /**//* 
    END OF DEMO CSS
    *************************************/
    
    /**//* CSS for my first scrolling box */
    #scrollingContainer{
        width:170px;    /**//* 170 pixels in width */
        height:250px;    /**//* Height of box */
        
        border:1px solid #000;    /**//* Black border around box */
        background-color: #E2EBED;    /**//* Light blue background color */

        padding:2px;    /**//* A little bit of space between border of box and text inside */
        float:left;    /**//* I want the text to wrap around the box */
        margin-right:10px;    /**//* Right margin of 10 pixels */
        font-size:0.9em;    /**//* Smaller font size than the rest of the page */
        
        overflow:hidden;    /**//* Hide overflow content */
    }
    /**//* End css for my first scrolling box */
    
    
    /**//* CSS for my second scrolling box */
    #scrollingContainer2{
        width:100px;    /**//* Width of second box */
        height:150px;    /**//* Height of second box */
        
        border:1px solid #000;
        background-color: #DDD;

        padding:2px;    /**//* A little bit of space between border of box and text inside */
        float:right;    /**//* I want the text to wrap around the box */
        margin-left:10px;    /**//* Space at the left of the box */
        color:red;    /**//* red text color */
        
        
    }
    #scrollingContent2{
        font-size:0.9em;
    }    
    </style>
    
    <script type="text/javascript">
    /**//************************************************************************************************************
    (C) www.dhtmlgoodies.com, November 2005
    
    This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.    
    
    Terms of use:
    You are free to use this script as long as the copyright message is kept intact. However, you may not
    redistribute, sell or repost it without our permission.
    
    Thank you!
    
    www.dhtmlgoodies.com
    Alf Magne Kalleland
    
    ************************************************************************************************************/
        
    var slideTimeBetweenSteps = 30;    // General speed variable (Lower = slower)
    
    
    var scrollingContainer = false;
    var scrollingContent = false;
    var containerHeight;
    var contentHeight;    
    
    var contentObjects = new Array();
    var originalslideSpeed = false;
    function slideContent(containerId)
    {
        var topPos = contentObjects[containerId]['objRef'].style.top.replace(/[^\-0-9]/g,'');
        topPos = topPos - contentObjects[containerId]['slideSpeed'];
        if(topPos/1 + contentObjects[containerId]['contentHeight']/1<0)topPos = contentObjects[containerId]['containerHeight'];
        contentObjects[containerId]['objRef'].style.top = topPos + 'px';
        setTimeout('slideContent("' + containerId + '")',slideTimeBetweenSteps);
        
    }
    
    function stopSliding()
    {
        var containerId = this.id;
        contentObjects[containerId]['slideSpeed'] = 0;    
    }
    
    function restartSliding()
    {
        var containerId = this.id;
        contentObjects[containerId]['slideSpeed'] = contentObjects[containerId]['originalSpeed'];
        
    }
    function initSlidingContent(containerId,slideSpeed)
    {
        scrollingContainer = document.getElementById(containerId);
        scrollingContent = scrollingContainer.getElementsByTagName('DIV')[0];
        
        scrollingContainer.style.position = 'relative';
        scrollingContainer.style.overflow = 'hidden';
        scrollingContent.style.position = 'relative';
        
        scrollingContainer.onmouseover = stopSliding;
        scrollingContainer.onmouseout = restartSliding;
        
        originalslideSpeed = slideSpeed;
        
        scrollingContent.style.top = '0px';
        
        contentObjects[containerId] = new Array();
        contentObjects[containerId]['objRef'] = scrollingContent;
        contentObjects[containerId]['contentHeight'] = scrollingContent.offsetHeight;
        contentObjects[containerId]['containerHeight'] = scrollingContainer.clientHeight;
        contentObjects[containerId]['slideSpeed'] = slideSpeed;
        contentObjects[containerId]['originalSpeed'] = slideSpeed;
        
        slideContent(containerId);
        
    }
    

    
    </script>

body:

 

<!-- THIS DIV TAG IS ONLY NEEDED FOR THE DEMO -->
<div id="mainContainer">

    <!-- Start of first scrolling box -->
    <div id="scrollingContainer">
        <div id="scrollingContent">
            <p>This is the content of my first scrolling box. The content here is just plain HTML. 
            The script has been tested in IE5+, Firefox and Opera 7+</p>
            <p>You can have unlimited number of scrolling boxes on your page.</p>
            <p>When you move your mouse over this box, the scrolling will stop.</p>
            <p>Download this and other cool scripts from <a href="http://www.dhtmlgoodies.com">dhtmlgoodies.com</a></p>    
        </div>
    </div>
    <script type="text/javascript">
    initSlidingContent('scrollingContainer',3);
    </script>
    <!-- End code for first scrolling box -->
    
    
    <!-- Start code for second scrolling box -->
    <div id="scrollingContainer2">
        <div id="scrollingContent2">
        <p>Tired of beaches, sun and warm weather? Why don't you visit Norway?</p>
        <p>Here, you will find a lot of cold and snowy weather. </p>
        </div>
    </div>
    <script type="text/javascript">
    initSlidingContent('scrollingContainer2',2);
    </script>
    <!-- End code for second scrolling box -->    
    
    <!-- THIS DIV TAG IS ONLY NEEDED FOR THE DEMO -->
    <div class="clear"></div>
    
    <!-- THIS END TAG IS ONLY NEEDED IN THE DEMO -->
</div>