请怎样做这个特效？我按上的按钮文本框里的文本会向上滚，我按下的按钮文本框里的文本会向下滚

<marquee direction=up id=mxh SCROLLDELAY="100" SCROLLAMOUNT ="2">
<table>
<tr><td>测试</td></tr>
<tr><td>测试</td></tr>
<tr><td>测试</td></tr>
<tr><td>测试</td></tr>
</table>
</marquee>
<input value=up type=button onclick="document.all.mxh.direction='up'">
<input value=down type=button onclick="document.all.mxh.direction='down'">

解决方案 »

  1.   

    当然用DHTML也可以实现，就是用setTimeout()来控制，这里就不多写了
      

  2.   

    <style type="text/css">
    #divControl {position:absolute; left:120px; top:190px; width:250px; font-size:10pt; font-family:arial,helvetica,sans-serif; visibility:hidden;}
    #divCont    {position:absolute; left:120px;top:250px; width:250px; height:150px; clip:rect(0px 250px 150px 0px);}
    .clScroll   {position:absolute; font-size:10pt; font-family:arial,helvetica,sans-serif; visibility:hidden;} 
    </style>
    <script language="JavaScript" type="text/javascript">function lib_bwcheck(){ //Browsercheck (needed)
    this.ver=navigator.appVersion
    this.agent=navigator.userAgent
    this.dom=document.getElementById?1:0
    this.opera5=this.agent.indexOf("Opera 5")>-1
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0; 
    this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
    this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
    this.ie=this.ie4||this.ie5||this.ie6
    this.mac=this.agent.indexOf("Mac")>-1
    this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
    return this
    }
    var bw=new lib_bwcheck()
    timSpeed = 50
    contHeight = 100
    function makeScrollObj(obj,nest){
    nest=(!nest) ? "":'document.'+nest+'.'
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
       this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
    this.height=bw.ns4?this.css.document.height:this.el.offsetHeight
    this.top=b_gettop
    return this
    }
    var px = bw.ns4||window.opera?"":"px";
    function b_gettop(){
    var gleft=(bw.ns4 || bw.ns6)?parseInt(this.css.top):eval(this.css.pixelTop);
    return gleft;
    }var scrollTim = 1;
    var active = 0;function scroll(speed){
    clearTimeout(scrollTim)
    way = speed>0?1:0
    if ((!way && oScroll[active].top()>-oScroll[active].height+contHeight) || (oScroll[active].top()<0 && way)){
    oScroll[active].css.top = (oScroll[active].top()+speed)+px
    scrollTim = setTimeout("scroll("+speed+")",timSpeed)
    }
    }
    function noScroll(){
    clearTimeout(scrollTim)
    }function changeActive(num){
    oScroll[active].css.visibility = "hidden"
    active = num
    oScroll[active].css.top = 0+px
    oScroll[active].css.visibility = "visible"
    }function scrollInit(){
    oScroll = new Array()
    oScroll[0] = new makeScrollObj('divScroll1','divCont')
    oScroll[1] = new makeScrollObj('divScroll2','divCont')
    oScroll[2] = new makeScrollObj('divScroll3','divCont')
    oScroll[3] = new makeScrollObj('divScroll4','divCont')

    oScroll[0].css.left = 0+px
    oScroll[0].css.top = 0+px
    oScroll[0].css.visibility = "visible"
    oControl = new makeScrollObj('divControl')
    oControl.css.visibility = "visible"
    }onload = scrollInit;</script>
    </head><body marginleft="0" marginheight="0">
    <!-- START DELETE -->
    <br><br><br>
    <!-- END DELETE --><div id="divControl">
    <a href="#" onclick="changeActive(0); return false">Page 1</a>
    <a href="#" onclick="changeActive(1); return false">Page 2</a>
    <a href="#" onclick="changeActive(2); return false">Page 3</a>
    <a href="#" onclick="changeActive(3); return false">Page 4</a>
    <br><br>
    <a href="#" onmouseover="scroll(5)" onmouseout="noScroll()" onclick="return false">up</a>
    <a href="#" onmouseover="scroll(-5)" onmouseout="noScroll()" onclick="return false">down</a>
    </div>
    <div id="divCont">
    <div id="divScroll1" class="clScroll">
    This is "page" 1, here you place some content.
    You should place more content then this
    or it won't scroll..blablablabl<br>
    <br>text text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy text text text dummy text text text dummy text <br>
    </div>

    <div id="divScroll2" class="clScroll">
    This is "page" 2...........
    <br>text textdummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy text text text dummy text text text dummy text <br>
    text text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy text text text dummy text text text dummy text <br>
    <br>text textdummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy text text text dummy text text text dummy text <br>
    text text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy text text text dummy text text text dummy text <br>
    </div> <div id="divScroll3" class="clScroll">
    This is "page" 3...........(can't scroll this one, to little content)
    <br>
    </div> <div id="divScroll4" class="clScroll">
    Page 4 
    text text dummy texttext text dummy texttext text dummy text<br>
    <br>ext text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy texttext text dummy texttext text dummy text<br>
    <br>text text dummy texttext text dummy texttext text dummy text<br>
    </div>
    </div>
      

  3.   

    <table border=1>
    <tr><td>
    <textarea id=a1>0
    1
    12
    123
    1234
    12345
    123456
    1234567
    12345678</textarea>
    </td></tr>
    </table>
    <button onclick=a1.doScroll("scrollbarPageUp")>Up</button>
    <button onclick=a1.doScroll("scrollbarPageDown")>Down</button>