PageUp and PageDown button!

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • yihan

    PageUp and PageDown button!

    Hi,
    I would like to make a pageUp and pageDown button to go up or down in the
    text ( it is like PgUp/PgDown on the keyboard). But it works on the IE but
    not on netscape 7.1. Could somebody tell me the problem? Thanks.

    The code as below:
    <HTML>
    <style type="text/css">
    <!--
    body
    {
    font-family:arial;
    font-size:11pt;
    color:#002000;
    background-color:rgb(252,2 49,197);
    width:450;
    text-align:justify;
    }
    -->
    </style>

    <HEAD>
    <SCRIPT LANGUAGE=javasc ript>
    <!--

    myBrowser=navig ator.appName
    myVersion=navig ator.appVersion
    var version45=(myVe rsion.indexOf(" 4.")!=-1||myVersion.in dexOf("5.")!=-1)
    var NS=(myBrowser.i ndexOf("Netscap e")!=-1 && version45)
    var IE=(myBrowser.i ndexOf("Explore r")!=-1 && version45)
    if(!NS&&!IE)ale rt("This file is intended to run under Netscape versions 4.0+
    or Internet Explorer versions 4.0+, and may not run properly on earlier
    versions")
    if(IE){var hide="hidden"; var show="visible"}
    if(NS){var hide="hide"; var show="show"}
    //-->
    </SCRIPT>
    <META NAME="GENERATOR " Content="Micros oft Visual Studio 6.0">
    <meta name=Author content="Franci s Hemsher (DynamicHTML@ho me.com) San Diego,
    Ca - 1999">
    <meta name=Descriptio n content="Dynami c Overlay Example - Using JavaScript
    and Cascasding Style Sheets to scroll the segment of a web page" >
    <meta name=keywords content="cross browser,Dynamic
    HTML,javascript ,example,Cascad ing,html,dynami c
    overlay,CSS,dyn amic,overlay,cr oss,browser">

    <title>Dynami c Overlay Example - Scrolling A Page Segment</title>

    </HEAD>
    <body>
    <script language=javasc ript>
    <!--
    var windowOpen=wind ow.opener
    if(!windowOpen && IE)
    document.write( "<a href=index.html >[HOME]</a><br>")
    if(document.ref errer=="" && NS)
    document.write( "<a href=index.html >[HOME]</a><br>")
    //-->
    </script>

    <DIV ID="frame" STYLE="position :absolute;top:3 00px;left:20px; ">

    </DIV>
    <DIV ID="slider" STYLE="position :absolute;top:3 25px;left:183px ;">

    </DIV>
    <div id="upBut" STYLE="position :absolute;top:3 06px;left:180px ;">
    <a href=javascript :nothing() onmousedown=pag eUp() onmouseup=stopU p()
    onmouseout=stop Up()>
    <img src=upButton.gi f border=0></a>
    </div>
    <div id="downBut" STYLE="position :absolute;top:4 25px;left:180px ;">
    <a href=javascript :nothing() onmousedown=pag eDown() onmouseup=stopD own()
    onmouseout=stop Down()>
    <img src=downButton. gif border=0></a>
    </div>
    <DIV ID="scrollArea " STYLE="position :absolute;top:3 07px;left:27px;
    width:150;font-size:8pt">

    This is Crunch the shark, who lives in the deep,
    dark ocean.<br>
    This is Claude the crab, a fuzzy little fella,
    a nice gift for your favorite mother-in-law.
    <br>
    Lucky, the ladybug brings good tidings to all.
    have one
    <br>
    This spider, named Spinner, a favorite for
    acrophobiacs.
    <br>
    Thanksgiving wouldn't be the same without
    Gobbles the turkey.
    <p>

    </DIV>


    <SCRIPT LANGUAGE="JavaS cript">
    <!-- //

    var scrollHeight=50 0
    var scrollTop
    var clipBottom =140
    var clipTop=0
    var clipSlider=0
    var t1=null
    var t2=null
    if(NS)document. scrollArea.clip .bottom=clipBot tom

    if(IE)document. all.scrollArea. style.clip="rec t(auto,auto,"+c lipBottom+",aut o
    )"

    function pageDown()
    {
    if(scrollHeight >0)
    {

    clipBottom+=5
    scrollHeight-=5
    if(NS)
    {
    scrollTop=parse Int(document.sc rollArea.top)
    document.scroll Area.clip.top +=5
    document.scroll Area.clip.botto m=clipBottom
    document.scroll Area.top=scroll Top -5
    document.slider .clip.top+=1

    }
    if(IE)
    {
    scrollTop=parse Int(document.al l.scrollArea.st yle.top)
    clipTop += 5
    document.all.sc rollArea.style. top=scrollTop-5

    document.all.sc rollArea.style. clip="rect("+cl ipTop+",auto,"+ clipBottom+",au t
    o)"
    clipSlider=clip Slider+1
    document.all.sl ider.style.clip ="rect("+clipSl ider+",auto,aut o,auto)"

    }
    t1=setTimeout(' pageDown()',10)
    }
    }


    function pageUp()
    {
    if(scrollHeight <500)
    {
    clipBottom-=5
    scrollHeight+=5
    if(NS)
    {
    scrollTop=parse Int(document.sc rollArea.top)
    document.scroll Area.clip.top -=5
    document.scroll Area.clip.botto m=clipBottom
    document.scroll Area.top=scroll Top +5
    document.slider .clip.top-=1

    }
    if(IE)
    {
    scrollTop=parse Int(document.al l.scrollArea.st yle.top)
    clipTop -= 5
    document.all.sc rollArea.style. top=scrollTop+5

    document.all.sc rollArea.style. clip="rect("+cl ipTop+",auto,"+ clipBottom+",au t
    o)"
    clipSlider=clip Slider-1
    document.all.sl ider.style.clip ="rect("+clipSl ider+",auto,aut o,auto)"

    }
    t2=setTimeout(' pageUp()',10)
    }
    }

    function stopUp()
    {
    clearTimeout(t2 )
    }

    function stopDown()
    {
    clearTimeout(t1 )
    }
    //-------deactivates onClick
    function nothing()
    {

    }
    // -->
    </SCRIPT>

    </BODY>
    </HTML>



  • kaeli

    #2
    Re: PageUp and PageDown button!

    In article <bvtik2$24p$1@b owmore.utu.fi>, wangzhao_wz@hot mail.com
    enlightened us with...[color=blue]
    > Hi,
    > I would like to make a pageUp and pageDown button to go up or down in the
    > text ( it is like PgUp/PgDown on the keyboard). But it works on the IE but
    > not on netscape 7.1. Could somebody tell me the problem? Thanks.
    >[/color]

    Oh, this explains it.
    <META NAME="GENERATOR " Content="Micros oft Visual Studio 6.0">

    Your script won't work on my favorite browser (Opera), either. Or any
    browser besides Netscape or IE. I sure hope this is for an intranet
    application...

    There is more wrong with that script than I have time to post.
    Especially since document.all, last I heard, was very possibly going
    away in IE.
    Oh, and when the doctype is set properly, not in quirks mode, in IE, the
    whole thing is fubar. I bet the HTML doesn't validate, either.

    As to the reason it won't work in NN, I get the error
    document.scroll Area has no properties
    This would be because scrollArea is a div. It needs
    document.getEle mentById("scrol lArea");
    Correcting this and using .style.top instead of top leads me to an error
    with clip. I don't use clip, so I give up there.

    Have fun. :)


    --
    --
    ~kaeli~
    Never say, "Oops!"; always say, "Ah, interesting!"



    Comment

    Working...