Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with my scrollBar. Div keeps scrolling after the bar is at it's farthest point

    I made this scrollbar a while ago, but I never perfected it. I feel like going back and looking at my old codes to perfect them, but I just can't seem to get this to work. Here is my scrollbar. Notice when you grab the bar and drag it all the way down, it still has some content area to scroll? Why is this? Can someone help please?
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    Quick look indicates that the ratio between scroll travel and content height is not correct

    Content height= raw content height - panel height

    Scroll travel is bar height-slider height

    Content travel = Content height*slider position/scroll travel

    but you already know that?

    so your maths need checking
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Alright. Thanks I'll play with it.
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    I will look(calulate) if you are still stuck
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #5
    New Coder
    Join Date
    Oct 2005
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    When dealing with things like this, i like to think of it in percents.
    i.e. lets say the scroll bar is scrolled 50px top. the scroll track is 200px in height. 50/200 : thats 25%.
    so now, you scroll the content. which has an offsetheight of say... 500. .25 * 500 = 125. so scroll the content top to -125. I hope this helps....

  • #6
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you both. Vic if you wouldn't mind I would love to have another set of eyes on this. Feel free to take some ideas because I know you have a scrollbar too. I have an A in math at the moment, but I just can't grasp this for some reason. I am a visual guy. I really don't want someone to do all the work for me, but I'm loving the pointers. Thanks a lot Flesh and Vic!

    Edit: Flesh - I will try working with percentages, and that really put it into perspective for me. The problem I had was that I started with a scrolltrack the height of the content area, therefore I just changed a bunch of stuff to fit the up and down arrows in.
    Last edited by Single Paradox; 05-27-2006 at 11:04 PM.
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #7
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    hmm

    your content height is 2698px;
    your content panel 400px;
    so the max scroll 2298

    never thougth of doing it this way.

    cant see how you calculate the content height in your code but with this data
    then the bar slider travel can be converted into content scroll.
    Code:
    function scrollBar(e){
     var bard=document.getElementById('bar');
     var contd=document.getElementById('content');
     var scrolld=document.getElementById('scrollbar');
     var overlapNum=(contd.scrollHeight/contd.clientHeight);
     mosY=(IE)?event.clientY:e.pageY;
     if(boolu==true&&(tempt+mosY-tmpY)>=bartop&&(tempt+mosY-tmpY)<=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=(tempt+mosY-tmpY)+"px";
    //  contd.scrollTop=(tempt+mosY-tmpY)*overlapNum-bartop*overlapNum;
     }
     else if(boolu==true&&(tempt+mosY-tmpY)<=bartop){
      scrolld.style.top=bartop+"px";
    //  contd.scrollTop=0+"px";
     }
     else if(boolu==true&&(tempt+mosY-tmpY)>=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=barheiht-parseInt(scrolld.style.height);
    //  contd.scrollTop=(tempt+mosY-tmpY)*overlapNum-bartop*overlapNum;
     }
     var ratio=Math.max((scrolld.offsetTop-102)/286,.0001);
     contd.scrollTop=2298*ratio;
    }
    I will find how best to obtain the 102,286 and 2298 tomorrow

    but you are using 370(-102?=268) as the slider travel, I make the travel 286, as I make the top position 102, this is a big difference

    Think I see whats going on, would be a lot easier if you put the slider in the bar,
    At the moment while the style top is 30px; the offsetTop is 102, this I think because the parent is the BODY(margins?)

    observation
    seems akward to keep using gEBId when the objects could be linked by properties to start with.
    Last edited by vwphillips; 05-28-2006 at 12:22 AM.
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #8
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you Vic, I need to see how you are doing this. Lemme take a look at your code and maybe I can figure it out. Thanks again.
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #9
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    Code:
    <html>
    <head>
    <title>Scrollbar</title>
    <script language="javascript" type="text/javascript">
    
    
    //scrollbar
    var barheiht=370;
    var contentheiht=400;
    var bartop=30;
    //arrows
    var increm=10;
    var speed=10;
    
    
    
    //No need to edit below here
    
    var IE=(document.all)?true:false;
    if(!IE){document.captureEvents(Event.MOUSEMOVE);}
    var boolu=false;
    var Timer;
    
    function setScroll(){
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    var overlapNum=(contd.scrollHeight/contd.clientHeight);
    
    if(contd.scrollHeight>contd.clientHeight){
    contd.scrollTop="0";
    scrolld.style.height=barheiht/overlapNum;
    }else{
    scrolld.style.display="none";
    bard.style.display="none";
    }
    }
    
    function enableScroll(e){
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    
    if(boolu==true){
    tempt=parseInt(scrolld.style.top);
    tmpY=(IE)?event.clientY:e.pageY;
    document.onmousemove=scrollBar;
    }
    }
    
    function scrollBar(e){
     var bard=document.getElementById('bar');
     var contd=document.getElementById('content');
     var scrolld=document.getElementById('scrollbar');
     var overlapNum=(contd.scrollHeight/contd.clientHeight);
     mosY=(IE)?event.clientY:e.pageY;
     if(boolu==true&&(tempt+mosY-tmpY)>=bartop&&(tempt+mosY-tmpY)<=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=(tempt+mosY-tmpY)+"px";
    //  contd.scrollTop=(tempt+mosY-tmpY)*overlapNum-bartop*overlapNum;
     }
     else if(boolu==true&&(tempt+mosY-tmpY)<=bartop){
      scrolld.style.top=bartop+"px";
    //  contd.scrollTop=0+"px";
     }
     else if(boolu==true&&(tempt+mosY-tmpY)>=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=barheiht-parseInt(scrolld.style.height);
    //  contd.scrollTop=(tempt+mosY-tmpY)*overlapNum-bartop*overlapNum;
     }
    document.Show.Show0.value=contd.scrollTop;
    document.Show.Show1.value=scrolld.offsetTop;
     var ratio=Math.max((scrolld.offsetTop-102)/286,.0001);
     contd.scrollTop=2298*ratio;
    }
    
    function scrll(dir){
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    var overlapNum=(contd.scrollHeight/contd.clientHeight);
    
    contd.scrollTop+=(increm*dir);
    scrolld.style.top=contd.scrollTop/overlapNum+bartop;
    Timer=setTimeout(function(){scrll(dir)},speed);
    }
    
    
    
    document.onmousedown=enableScroll;
    document.onmouseup=function(){boolu=false;clearTimeout(Timer);};
    document.onblur=function(){boolu=false};
    window.onload=setScroll;
    </script>
    <style>
    #scrollbar{background:#999;height:60px;width:15px;float:left;position:relative;left:15px;z-index:1;}
    #bar{background:#DDD;height:340px;width:15px;float:left;position:relative;top:30px;z-index:0;}
    #content{background:#DDD;height:400px;width:400px;float:left;overflow:hidden;}
    </style>
    </head>
    <body>
    <br><BR><BR>
    <div id="content">
    <P>Once upon a midnight dreary, while I pondered, weak and weary,<BR>Over many a
    quaint and curious volume of forgotten lore,<BR>While I nodded, nearly napping,
    suddenly there came a tapping,<BR>As of someone gently rapping, rapping at my
    chamber door.<BR>" 'Tis some visitor," I muttered, "tapping at my chamber
    door;<BR>Only this, and nothing more."<BR></P>
    
    <P>Ah, distinctly I remember, it was in the bleak December,<BR>And each separate
    dying ember wrought its ghost upon the floor.<BR>Eagerly I wished the morrow;
    vainly I had sought to borrow<BR>From my <A href="library.html">books</A>
    surcease of sorrow, sorrow for the lost Lenore,.<BR>For the rare and radiant
    maiden whom the angels name <A href="lenore.html">Lenore,</A><BR>Nameless here
    forevermore.<BR></P>
    <P>And the silken sad uncertain rustling of each purple curtain<BR>Thrilled
    me---filled me with fantastic terrors never felt before;<BR>So that now, to
    still the beating of my heart, I stood repeating,<BR>" 'Tis some visitor
    entreating entrance at my chamber door,<BR>Some late visitor entreating entrance
    at my chamber door.<BR>This it is, and nothing more."<BR></P>
    
    <P>Presently my soul grew stronger; hesitating then no longer,<BR>"Sir," said I,
    "or madam, truly your forgiveness I implore;<BR>But the fact is, I was napping,
    and so gently you came rapping,<BR>And so faintly you came tapping, tapping at
    my chamber door,<BR>That I scarce was sure I heard you." Here I opened wide the
    door;---<BR>Darkness there, and nothing more.<BR></P>
    <P>Deep into the darkness peering, long I stood there, wondering,
    fearing<BR>Doubting, dreaming dreams no mortals ever dared to dream
    before;<BR>But the silence was unbroken, and the stillness gave no token,<BR>And
    the only word there spoken was the whispered word,<BR><A
    href="lenore.html">Lenore?</A>, This I whispered, and an echo murmured back the
    word,<BR>"Lenore!" Merely this, and nothing more.<BR></P>
    <P>Back into the chamber turning, all my soul within me burning,<BR>Soon again I
    heard a tapping, something louder than before,<BR>"Surely," said I, "surely,
    that is something at my window lattice.<BR>Let me see, then, what thereat is,
    and this mystery explore.<BR>Let my heart be still a moment, and this mystery
    explore.<BR>" 'Tis the wind, and nothing more."<BR></P>
    
    <P>Open here I flung the shutter, when, with many a flirt and flutter,<BR>In
    there stepped a stately raven, of the saintly days of yore.<BR>Not the least
    obeisance made he; not a minute stopped or stayed he;<BR>But with mien of lord
    or lady, perched above my chamber door.<BR>Perched upon a bust of Pallas, just
    above my chamber door,<BR>Perched, and sat, and nothing more.<BR></P>
    <P>Then this ebony bird beguiling my sad fancy into smiling,<BR>By the grave and
    stern decorum of the countenance it wore,<BR>"Though thy crest be shorn and
    shaven thou," I said, "art sure no craven,<BR>Ghastly, grim, and ancient raven,
    wandering from the nightly shore.<BR>Tell me what the lordly name is on the
    Night's Plutonian shore."<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>Much I marvelled this ungainly fowl to hear discourse so plainly,<BR>Though
    its answer little meaning, little relevancy bore;<BR>For we cannot help agreeing
    that no living human being<BR>Ever yet was blessed with seeing bird above his
    chamber door,<BR>Bird or beast upon the sculptured bust above his chamber
    door,<BR>With such name as "Nevermore."<BR></P>
    
    <P>But the raven, sitting lonely on that placid bust, spoke only<BR>That one
    word, as if his soul in that one word he did outpour.<BR>Nothing further then he
    uttered; not a feather then he fluttered;<BR>Till I scarcely more than muttered,
    "Other friends have flown before;<BR>On the morrow he will leave me, as my hopes
    have flown before."<BR>Then the bird said, "Nevermore."<BR></P>
    <P>Startled at the stillness broken by reply so aptly spoken,<BR>"Doubtless,"
    said I, "what it utters is its only stock and store,<BR>Caught from some unhappy
    master, whom unmerciful disaster<BR>Followed fast and followed faster, till his
    songs one burden bore,---<BR>Till the dirges of his hope that melancholy burden
    bore<BR>Of "Never---nevermore."<BR></P>
    <P>But the raven still beguiling all my sad soul into smiling,<BR>Straight I
    wheeled a cushioned seat in front of bird, and bust and door;<BR>Then, upon the
    velvet sinking, I betook myself to linking<BR>Fancy unto fancy, thinking what
    this ominous bird of yore --<BR>What this grim, ungainly, ghastly, gaunt and
    ominous bird of yore<BR>                                       Meant in croaking
    "Nevermore." </P>
    
    <P>Thus I sat engaged in guessing, but no syllable expressing<BR>To the fowl,
    whose fiery eyes now burned into my bosom's core;<BR>This and more I sat
    divining, with my head at ease reclining<BR>On the cushion's velvet lining that
    the lamplight gloated o'er,<BR>But whose velvet violet lining with the lamplight
    gloating o'er<BR>She shall press, ah, nevermore!<BR></P>
    <P>Then, methought, the air grew denser, perfumed from an unseen censer<BR>Swung
    by seraphim whose footfalls tinkled on the tufted floor.<BR>"Wretch," I cried,
    "thy God hath lent thee -- by these angels he hath<BR>Sent thee
    respite---respite and nepenthe from thy memories of Lenore!<BR>Quaff, O quaff
    this kind nepenthe, and forget this lost Lenore!"<BR>Quoth the raven,
    "Nevermore!"<BR></P>
    <P>"Prophet!" said I, "thing of evil!--prophet still, if bird or
    devil!<BR>Whether tempter sent, or whether tempest tossed thee here
    ashore,<BR>Desolate, yet all undaunted, on this desert land enchanted--<BR>On
    this home by horror haunted--tell me truly, I implore:<BR>Is there--is there
    balm in Gilead?--tell me--tell me I implore!"<BR>Quoth the raven,
    "Nevermore."<BR></P>
    
    <P>"Prophet!" said I, "thing of evil--prophet still, if bird or devil!<BR>By
    that heaven that bends above us--by that God we both adore--<BR>Tell this soul
    with sorrow laden, if, within the distant Aidenn,<BR>It shall clasp a sainted
    maiden, whom the angels name Lenore---<BR>Clasp a rare and radiant maiden, whom
    the angels name Lenore?<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>"Be that word our sign of parting, bird or fiend!" I shrieked,
    upstarting--<BR>"Get thee back into the tempest and the Night's Plutonian
    shore!<BR>Leave no black plume as a token of that lie thy soul hath
    spoken!<BR>Leave my loneliness unbroken! -- quit the bust above my door!<BR>Take
    thy beak from out my heart, and take thy form from off <A href="mydoor.html">my
    door!</A>"<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>And the raven, never flitting, still is sitting, still is sitting<BR>On the
    pallid bust of Pallas just above my chamber door;<BR>And his eyes have all the
    seeming of a demon's that is dreaming.<BR>And the lamplight o'er him streaming
    throws his shadow on the floor;<BR>And my soul from out that shadow that lies
    floating on the floor<BR>Shall be lifted---nevermore!<BR></P>
    
    </div>
    
    
    <div onmousedown="boolu=true" unselectable="on" style="top:30px;" id="scrollbar"></div>
    <div id="bar"></div>
    
    <br><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
    <div>
    <a href="http://en.wikipedia.org/wiki/The_Raven">The Raven</a> by <cite><a href="http://en.wikipedia.org/wiki/Edgar_Allen_Poe">Edgar Allen Poe</a></cite>
    </div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:72px;left:425px;" onmousedown="scrll(-1);" onmouseup="clearTimeout(Timer);"></div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:453px;left:425px;" onmousedown="scrll(1);" onmouseup="clearTimeout(Timer);"></div>
    <script> vic=0; </script>
    <form name=Show id=Show style="position:absolute;visibility:visible;top:0px;left:0px;" >
    <input size=10 name=Show0 >
    <input size=10 name=Show1 >
    <input size=10 name=Show2 >
    <input size=10 name=Show3 >
    <input size=10 name=Show4 >
    <input size=10 name=Show5 >
    <input size=10 name=Show6 >
    <input size=10 name=Show7 >
    <input size=10 name=Show8 >
    <input size=10 name=Show9 >
    </form>
    
    
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #10
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    this shows what I meen by attaching properties, so much easier?
    much more can be done but I will let you consider this before I complete
    Code:
    <html>
    <head>
    <title>Scrollbar</title>
    <script language="javascript" type="text/javascript">
    
    
    //scrollbar
    var barheiht=370;
    var contentheiht=400;
    var bartop=30;
    //arrows
    var increm=10;
    var speed=10;
    
    
    
    //No need to edit below here
    
    var IE=(document.all)?true:false;
    if(!IE){document.captureEvents(Event.MOUSEMOVE);}
    var boolu=false;
    var Timer;
    
    function setScroll(){
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    var overlapNum=(contd.scrollHeight/contd.clientHeight);
    
    if(contd.scrollHeight>contd.clientHeight){
    contd.scrollTop="0";
    scrolld.style.height=barheiht/overlapNum;
    }else{
    scrolld.style.display="none";
    bard.style.display="none";
    }
    }
    
    
    function enableScroll(e){
    if(!boolu){ return; }
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    if (!scrolld.data){ scrolld.data=[scrolld.offsetTop,bard.offsetHeight-scrolld.offsetHeight,contd,contd.scrollHeight-contd.offsetHeight ]; }
    tempt=parseInt(scrolld.style.top);
    tmpY=(IE)?event.clientY:e.pageY;
    document.onmousemove=scrollBar;
    }
    
    function scrollBar(e){
     if (!boolu){ return; }
     var scrolld=document.getElementById('scrollbar');
     mosY=(IE)?event.clientY:e.pageY;
     if((tempt+mosY-tmpY)>=bartop&&(tempt+mosY-tmpY)<=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=(tempt+mosY-tmpY)+"px";
     }
     else if((tempt+mosY-tmpY)<=bartop){
      scrolld.style.top=bartop+"px";
     }
     else if((tempt+mosY-tmpY)>=barheiht-parseInt(scrolld.style.height)){
      scrolld.style.top=barheiht-parseInt(scrolld.style.height);
     }
     var ratio=Math.max((scrolld.offsetTop-scrolld.data[0])/scrolld.data[1],.0001);
     scrolld.data[2].scrollTop=scrolld.data[3]*ratio;
    }
    
    function scrll(dir){
    var bard=document.getElementById('bar');
    var contd=document.getElementById('content');
    var scrolld=document.getElementById('scrollbar');
    var overlapNum=(contd.scrollHeight/contd.clientHeight);
    
    contd.scrollTop+=(increm*dir);
    scrolld.style.top=contd.scrollTop/overlapNum+bartop;
    Timer=setTimeout(function(){scrll(dir)},speed);
    }
    
    
    
    document.onmousedown=enableScroll;
    document.onmouseup=function(){boolu=false;clearTimeout(Timer);};
    document.onblur=function(){boolu=false};
    window.onload=setScroll;
    </script>
    <style>
    #scrollbar{background:#999;height:60px;width:15px;float:left;position:relative;left:15px;z-index:1;}
    #bar{background:#DDD;height:340px;width:15px;float:left;position:relative;top:30px;z-index:0;}
    #content{background:#DDD;height:400px;width:400px;float:left;overflow:hidden;}
    </style>
    </head>
    <body>
    <br><BR><BR>
    <div id="content">
    <P>Once upon a midnight dreary, while I pondered, weak and weary,<BR>Over many a
    quaint and curious volume of forgotten lore,<BR>While I nodded, nearly napping,
    suddenly there came a tapping,<BR>As of someone gently rapping, rapping at my
    chamber door.<BR>" 'Tis some visitor," I muttered, "tapping at my chamber
    door;<BR>Only this, and nothing more."<BR></P>
    
    <P>Ah, distinctly I remember, it was in the bleak December,<BR>And each separate
    dying ember wrought its ghost upon the floor.<BR>Eagerly I wished the morrow;
    vainly I had sought to borrow<BR>From my <A href="library.html">books</A>
    surcease of sorrow, sorrow for the lost Lenore,.<BR>For the rare and radiant
    maiden whom the angels name <A href="lenore.html">Lenore,</A><BR>Nameless here
    forevermore.<BR></P>
    <P>And the silken sad uncertain rustling of each purple curtain<BR>Thrilled
    me---filled me with fantastic terrors never felt before;<BR>So that now, to
    still the beating of my heart, I stood repeating,<BR>" 'Tis some visitor
    entreating entrance at my chamber door,<BR>Some late visitor entreating entrance
    at my chamber door.<BR>This it is, and nothing more."<BR></P>
    
    <P>Presently my soul grew stronger; hesitating then no longer,<BR>"Sir," said I,
    "or madam, truly your forgiveness I implore;<BR>But the fact is, I was napping,
    and so gently you came rapping,<BR>And so faintly you came tapping, tapping at
    my chamber door,<BR>That I scarce was sure I heard you." Here I opened wide the
    door;---<BR>Darkness there, and nothing more.<BR></P>
    <P>Deep into the darkness peering, long I stood there, wondering,
    fearing<BR>Doubting, dreaming dreams no mortals ever dared to dream
    before;<BR>But the silence was unbroken, and the stillness gave no token,<BR>And
    the only word there spoken was the whispered word,<BR><A
    href="lenore.html">Lenore?</A>, This I whispered, and an echo murmured back the
    word,<BR>"Lenore!" Merely this, and nothing more.<BR></P>
    <P>Back into the chamber turning, all my soul within me burning,<BR>Soon again I
    heard a tapping, something louder than before,<BR>"Surely," said I, "surely,
    that is something at my window lattice.<BR>Let me see, then, what thereat is,
    and this mystery explore.<BR>Let my heart be still a moment, and this mystery
    explore.<BR>" 'Tis the wind, and nothing more."<BR></P>
    
    <P>Open here I flung the shutter, when, with many a flirt and flutter,<BR>In
    there stepped a stately raven, of the saintly days of yore.<BR>Not the least
    obeisance made he; not a minute stopped or stayed he;<BR>But with mien of lord
    or lady, perched above my chamber door.<BR>Perched upon a bust of Pallas, just
    above my chamber door,<BR>Perched, and sat, and nothing more.<BR></P>
    <P>Then this ebony bird beguiling my sad fancy into smiling,<BR>By the grave and
    stern decorum of the countenance it wore,<BR>"Though thy crest be shorn and
    shaven thou," I said, "art sure no craven,<BR>Ghastly, grim, and ancient raven,
    wandering from the nightly shore.<BR>Tell me what the lordly name is on the
    Night's Plutonian shore."<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>Much I marvelled this ungainly fowl to hear discourse so plainly,<BR>Though
    its answer little meaning, little relevancy bore;<BR>For we cannot help agreeing
    that no living human being<BR>Ever yet was blessed with seeing bird above his
    chamber door,<BR>Bird or beast upon the sculptured bust above his chamber
    door,<BR>With such name as "Nevermore."<BR></P>
    
    <P>But the raven, sitting lonely on that placid bust, spoke only<BR>That one
    word, as if his soul in that one word he did outpour.<BR>Nothing further then he
    uttered; not a feather then he fluttered;<BR>Till I scarcely more than muttered,
    "Other friends have flown before;<BR>On the morrow he will leave me, as my hopes
    have flown before."<BR>Then the bird said, "Nevermore."<BR></P>
    <P>Startled at the stillness broken by reply so aptly spoken,<BR>"Doubtless,"
    said I, "what it utters is its only stock and store,<BR>Caught from some unhappy
    master, whom unmerciful disaster<BR>Followed fast and followed faster, till his
    songs one burden bore,---<BR>Till the dirges of his hope that melancholy burden
    bore<BR>Of "Never---nevermore."<BR></P>
    <P>But the raven still beguiling all my sad soul into smiling,<BR>Straight I
    wheeled a cushioned seat in front of bird, and bust and door;<BR>Then, upon the
    velvet sinking, I betook myself to linking<BR>Fancy unto fancy, thinking what
    this ominous bird of yore --<BR>What this grim, ungainly, ghastly, gaunt and
    ominous bird of yore<BR>                                       Meant in croaking
    "Nevermore." </P>
    
    <P>Thus I sat engaged in guessing, but no syllable expressing<BR>To the fowl,
    whose fiery eyes now burned into my bosom's core;<BR>This and more I sat
    divining, with my head at ease reclining<BR>On the cushion's velvet lining that
    the lamplight gloated o'er,<BR>But whose velvet violet lining with the lamplight
    gloating o'er<BR>She shall press, ah, nevermore!<BR></P>
    <P>Then, methought, the air grew denser, perfumed from an unseen censer<BR>Swung
    by seraphim whose footfalls tinkled on the tufted floor.<BR>"Wretch," I cried,
    "thy God hath lent thee -- by these angels he hath<BR>Sent thee
    respite---respite and nepenthe from thy memories of Lenore!<BR>Quaff, O quaff
    this kind nepenthe, and forget this lost Lenore!"<BR>Quoth the raven,
    "Nevermore!"<BR></P>
    <P>"Prophet!" said I, "thing of evil!--prophet still, if bird or
    devil!<BR>Whether tempter sent, or whether tempest tossed thee here
    ashore,<BR>Desolate, yet all undaunted, on this desert land enchanted--<BR>On
    this home by horror haunted--tell me truly, I implore:<BR>Is there--is there
    balm in Gilead?--tell me--tell me I implore!"<BR>Quoth the raven,
    "Nevermore."<BR></P>
    
    <P>"Prophet!" said I, "thing of evil--prophet still, if bird or devil!<BR>By
    that heaven that bends above us--by that God we both adore--<BR>Tell this soul
    with sorrow laden, if, within the distant Aidenn,<BR>It shall clasp a sainted
    maiden, whom the angels name Lenore---<BR>Clasp a rare and radiant maiden, whom
    the angels name Lenore?<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>"Be that word our sign of parting, bird or fiend!" I shrieked,
    upstarting--<BR>"Get thee back into the tempest and the Night's Plutonian
    shore!<BR>Leave no black plume as a token of that lie thy soul hath
    spoken!<BR>Leave my loneliness unbroken! -- quit the bust above my door!<BR>Take
    thy beak from out my heart, and take thy form from off <A href="mydoor.html">my
    door!</A>"<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>And the raven, never flitting, still is sitting, still is sitting<BR>On the
    pallid bust of Pallas just above my chamber door;<BR>And his eyes have all the
    seeming of a demon's that is dreaming.<BR>And the lamplight o'er him streaming
    throws his shadow on the floor;<BR>And my soul from out that shadow that lies
    floating on the floor<BR>Shall be lifted---nevermore!<BR></P>
    
    </div>
    
    
    <div onmousedown="boolu=true" unselectable="on" style="top:30px;" id="scrollbar" style="background-color:blue;"></div>
    <div id="bar" style="background-color:green;" ></div>
    
    <br><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
    <div>
    <a href="http://en.wikipedia.org/wiki/The_Raven">The Raven</a> by <cite><a href="http://en.wikipedia.org/wiki/Edgar_Allen_Poe">Edgar Allen Poe</a></cite>
    </div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:72px;left:425px;" onmousedown="scrll(-1);" onmouseup="clearTimeout(Timer);"></div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:453px;left:425px;" onmousedown="scrll(1);" onmouseup="clearTimeout(Timer);"></div>
    <script> vic=0; </script>
    <form name=Show id=Show style="position:absolute;visibility:visible;top:0px;left:0px;" >
    <input size=50 name=Show0 >
    <input size=10 name=Show1 >
    <input size=10 name=Show2 >
    <input size=10 name=Show3 >
    <input size=10 name=Show4 >
    <input size=10 name=Show5 >
    <input size=10 name=Show6 >
    <input size=10 name=Show7 >
    <input size=10 name=Show8 >
    <input size=10 name=Show9 >
    </form>
    
    
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #11
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    DONT look at this

    Code:
    <html>
    <head>
    <title>Scrollbar</title>
    <script language="javascript" type="text/javascript">
    
    
    //scrollbar
    var barheiht=370;
    //arrows
    var speed=10;
    
    
    
    //No need to edit below here
    
    var IE=(document.all)?true:false;
    if(!IE){document.captureEvents(Event.MOUSEMOVE);}
    
    var boolu;
    var Timer;
    
    function zxcScrollInit(){
     var zxcargs=zxcScrollInit.arguments;
     var scrolld=document.getElementById(zxcargs[0]);
     var bard=scrolld.parentNode;
     var contd=document.getElementById(zxcargs[1]);
     if(contd.scrollHeight>contd.clientHeight){
      contd.scrollTop="0";
      scrolld.style.height=barheiht/(contd.scrollHeight/contd.clientHeight);
     }
     else {
      scrolld.style.display="none";
      bard.style.display="none";
     }
     if (!scrolld.data){ scrolld.data=[parseInt(scrolld.style.top),bard.offsetHeight-parseInt(scrolld.style.height),contd,contd.scrollHeight-contd.offsetHeight ]; }
    }
    
    function zxcSrtScroll(zxcevt,zxcobj){
     boolu=zxcobj;
     zxcobj.data[0]=parseInt(zxcobj.style.top);
    }
    
    function enableScroll(e){
     if(!boolu){ return; }
     tmpY=(IE)?event.clientY:e.pageY;
    }
    
    function scrollBar(e){
     if (!boolu){ return; }
     mosY=(IE)?event.clientY:e.pageY;
     document.Show.Show0.value=boolu.data;
     zxcpos=mosY-tmpY;
     if (boolu.data[0]+zxcpos>0&&boolu.data[0]+zxcpos<boolu.data[1]){
      boolu.style.top=(boolu.data[0]+zxcpos)+'px';
     }
     zxcScrollContent(boolu,boolu.data[0],zxcpos);
    }
    
    function zxcScrollContent(zxcobj,zxcdata,zxcpos){
     if (zxcdata+zxcpos>0&&zxcdata+zxcpos<zxcobj.data[1]){
      zxcobj.style.top=(zxcdata+zxcpos)+'px';
     }
     var zxcratio=Math.max((parseInt(zxcobj.style.top))/zxcobj.data[1],.0001);
     zxcobj.data[2].scrollTop=zxcobj.data[3]*zxcratio;
     if (zxcobj.data[2].scrollTop<10){ zxcobj.data[2].scrollTop=0; }
    }
    
    function scrll(zxcobj,dir){
     var scrolld=document.getElementById(zxcobj);
     var zxcpos=parseInt(scrolld.style.top)+dir;
     zxcScrollContent(scrolld,0,zxcpos)
     Timer=setTimeout(function(){scrll(zxcobj,dir)},speed);
    }
    
    
    
    document.onmousemove=scrollBar;
    document.onmousedown=enableScroll;
    document.onmouseup=function(){
     boolu=false;
     clearTimeout(Timer);
    };
    document.onblur=function(){boolu=false};
    
    </script>
    
    <style>
    #scrollbar{background:#999;height:60px;width:15px;float:left;position:relative;left:15px;z-index:1;}
    #bar{background:#DDD;height:340px;width:15px;float:left;position:relative;top:30px;z-index:0;}
    #content{background:#DDD;height:400px;width:400px;float:left;overflow:hidden;}
    #scrollbar1{background:#999;height:60px;width:15px;float:left;position:relative;left:15px;z-index:1;}
    #bar1{position:absolute;left:20px;top:500px;background:#DDD;height:340px;width:15px;z-index:0;}
    #content1{position:absolute;background:#DDD;height:400px;width:400px;left:100px;top:500px;overflow:hidden;}
    </style>
    </head>
    <body onload="zxcScrollInit('scrollbar','content');zxcScrollInit('scrollbar1','content1')">
    <br><BR><BR>
    <div id="content">
    <P>Once upon a midnight dreary, while I pondered, weak and weary,<BR>Over many a
    quaint and curious volume of forgotten lore,<BR>While I nodded, nearly napping,
    suddenly there came a tapping,<BR>As of someone gently rapping, rapping at my
    chamber door.<BR>" 'Tis some visitor," I muttered, "tapping at my chamber
    door;<BR>Only this, and nothing more."<BR></P>
    
    <P>Ah, distinctly I remember, it was in the bleak December,<BR>And each separate
    dying ember wrought its ghost upon the floor.<BR>Eagerly I wished the morrow;
    vainly I had sought to borrow<BR>From my <A href="library.html">books</A>
    surcease of sorrow, sorrow for the lost Lenore,.<BR>For the rare and radiant
    maiden whom the angels name <A href="lenore.html">Lenore,</A><BR>Nameless here
    forevermore.<BR></P>
    <P>And the silken sad uncertain rustling of each purple curtain<BR>Thrilled
    me---filled me with fantastic terrors never felt before;<BR>So that now, to
    still the beating of my heart, I stood repeating,<BR>" 'Tis some visitor
    entreating entrance at my chamber door,<BR>Some late visitor entreating entrance
    at my chamber door.<BR>This it is, and nothing more."<BR></P>
    
    <P>Presently my soul grew stronger; hesitating then no longer,<BR>"Sir," said I,
    "or madam, truly your forgiveness I implore;<BR>But the fact is, I was napping,
    and so gently you came rapping,<BR>And so faintly you came tapping, tapping at
    my chamber door,<BR>That I scarce was sure I heard you." Here I opened wide the
    door;---<BR>Darkness there, and nothing more.<BR></P>
    <P>Deep into the darkness peering, long I stood there, wondering,
    fearing<BR>Doubting, dreaming dreams no mortals ever dared to dream
    before;<BR>But the silence was unbroken, and the stillness gave no token,<BR>And
    the only word there spoken was the whispered word,<BR><A
    href="lenore.html">Lenore?</A>, This I whispered, and an echo murmured back the
    word,<BR>"Lenore!" Merely this, and nothing more.<BR></P>
    <P>Back into the chamber turning, all my soul within me burning,<BR>Soon again I
    heard a tapping, something louder than before,<BR>"Surely," said I, "surely,
    that is something at my window lattice.<BR>Let me see, then, what thereat is,
    and this mystery explore.<BR>Let my heart be still a moment, and this mystery
    explore.<BR>" 'Tis the wind, and nothing more."<BR></P>
    
    <P>Open here I flung the shutter, when, with many a flirt and flutter,<BR>In
    there stepped a stately raven, of the saintly days of yore.<BR>Not the least
    obeisance made he; not a minute stopped or stayed he;<BR>But with mien of lord
    or lady, perched above my chamber door.<BR>Perched upon a bust of Pallas, just
    above my chamber door,<BR>Perched, and sat, and nothing more.<BR></P>
    <P>Then this ebony bird beguiling my sad fancy into smiling,<BR>By the grave and
    stern decorum of the countenance it wore,<BR>"Though thy crest be shorn and
    shaven thou," I said, "art sure no craven,<BR>Ghastly, grim, and ancient raven,
    wandering from the nightly shore.<BR>Tell me what the lordly name is on the
    Night's Plutonian shore."<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>Much I marvelled this ungainly fowl to hear discourse so plainly,<BR>Though
    its answer little meaning, little relevancy bore;<BR>For we cannot help agreeing
    that no living human being<BR>Ever yet was blessed with seeing bird above his
    chamber door,<BR>Bird or beast upon the sculptured bust above his chamber
    door,<BR>With such name as "Nevermore."<BR></P>
    
    <P>But the raven, sitting lonely on that placid bust, spoke only<BR>That one
    word, as if his soul in that one word he did outpour.<BR>Nothing further then he
    uttered; not a feather then he fluttered;<BR>Till I scarcely more than muttered,
    "Other friends have flown before;<BR>On the morrow he will leave me, as my hopes
    have flown before."<BR>Then the bird said, "Nevermore."<BR></P>
    <P>Startled at the stillness broken by reply so aptly spoken,<BR>"Doubtless,"
    said I, "what it utters is its only stock and store,<BR>Caught from some unhappy
    master, whom unmerciful disaster<BR>Followed fast and followed faster, till his
    songs one burden bore,---<BR>Till the dirges of his hope that melancholy burden
    bore<BR>Of "Never---nevermore."<BR></P>
    <P>But the raven still beguiling all my sad soul into smiling,<BR>Straight I
    wheeled a cushioned seat in front of bird, and bust and door;<BR>Then, upon the
    velvet sinking, I betook myself to linking<BR>Fancy unto fancy, thinking what
    this ominous bird of yore --<BR>What this grim, ungainly, ghastly, gaunt and
    ominous bird of yore<BR>                                       Meant in croaking
    "Nevermore." </P>
    
    <P>Thus I sat engaged in guessing, but no syllable expressing<BR>To the fowl,
    whose fiery eyes now burned into my bosom's core;<BR>This and more I sat
    divining, with my head at ease reclining<BR>On the cushion's velvet lining that
    the lamplight gloated o'er,<BR>But whose velvet violet lining with the lamplight
    gloating o'er<BR>She shall press, ah, nevermore!<BR></P>
    <P>Then, methought, the air grew denser, perfumed from an unseen censer<BR>Swung
    by seraphim whose footfalls tinkled on the tufted floor.<BR>"Wretch," I cried,
    "thy God hath lent thee -- by these angels he hath<BR>Sent thee
    respite---respite and nepenthe from thy memories of Lenore!<BR>Quaff, O quaff
    this kind nepenthe, and forget this lost Lenore!"<BR>Quoth the raven,
    "Nevermore!"<BR></P>
    <P>"Prophet!" said I, "thing of evil!--prophet still, if bird or
    devil!<BR>Whether tempter sent, or whether tempest tossed thee here
    ashore,<BR>Desolate, yet all undaunted, on this desert land enchanted--<BR>On
    this home by horror haunted--tell me truly, I implore:<BR>Is there--is there
    balm in Gilead?--tell me--tell me I implore!"<BR>Quoth the raven,
    "Nevermore."<BR></P>
    
    <P>"Prophet!" said I, "thing of evil--prophet still, if bird or devil!<BR>By
    that heaven that bends above us--by that God we both adore--<BR>Tell this soul
    with sorrow laden, if, within the distant Aidenn,<BR>It shall clasp a sainted
    maiden, whom the angels name Lenore---<BR>Clasp a rare and radiant maiden, whom
    the angels name Lenore?<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>"Be that word our sign of parting, bird or fiend!" I shrieked,
    upstarting--<BR>"Get thee back into the tempest and the Night's Plutonian
    shore!<BR>Leave no black plume as a token of that lie thy soul hath
    spoken!<BR>Leave my loneliness unbroken! -- quit the bust above my door!<BR>Take
    thy beak from out my heart, and take thy form from off <A href="mydoor.html">my
    door!</A>"<BR>Quoth the raven, "Nevermore."<BR></P>
    <P>And the raven, never flitting, still is sitting, still is sitting<BR>On the
    pallid bust of Pallas just above my chamber door;<BR>And his eyes have all the
    seeming of a demon's that is dreaming.<BR>And the lamplight o'er him streaming
    throws his shadow on the floor;<BR>And my soul from out that shadow that lies
    floating on the floor<BR>Shall be lifted---nevermore!<BR></P><br>
    
    </div>
    
    <div id="bar" style="left:15px;background-color:green;" >
    <div onmousedown="zxcSrtScroll(event,this);" unselectable="on" id="scrollbar" style="left:0px;top:0px;background-color:blue;"></div>
    </div>
    
    
    <div id="content1">
    
    <P>Ah, distinctly I remember, it was in the bleak December,<BR>And each separate
    dying ember wrought its ghost upon the floor.<BR>Eagerly I wished the morrow;
    vainly I had sought to borrow<BR>From my <A href="library.html">books</A>
    surcease of sorrow, sorrow for the lost Lenore,.<BR>For the rare and radiant
    maiden whom the angels name <A href="lenore.html">Lenore,</A><BR>Nameless here
    forevermore.<BR></P>
    <P>And the silken sad uncertain rustling of each purple curtain<BR>Thrilled
    me---filled me with fantastic terrors never felt before;<BR>So that now, to
    still the beating of my heart, I stood repeating,<BR>" 'Tis some visitor
    entreating entrance at my chamber door,<BR>Some late visitor entreating entrance
    at my chamber door.<BR>This it is, and nothing more."<BR></P>
    
    <P>Presently my soul grew stronger; hesitating then no longer,<BR>"Sir," said I,
    "or madam, truly your forgiveness I implore;<BR>But the fact is, I was napping,
    and so gently you came rapping,<BR>And so faintly you came tapping, tapping at
    my chamber door,<BR>That I scarce was sure I heard you." Here I opened wide the
    door;---<BR>Darkness there, and nothing more.<BR></P>
    <P>Deep into the darkness peering, long I stood there, wondering,
    fearing<BR>Doubting, dreaming dreams no mortals ever dared to dream
    before;<BR>But the silence was unbroken, and the stillness gave no token,<BR>And
    the only word there spoken was the whispered word,<BR><A
    href="lenore.html">Lenore?</A>, This I whispered, and an echo murmured back the
    word,<BR>"Lenore!" Merely this, and nothing more.<BR></P>
    <P>Back into the chamber turning, all my soul within me burning,<BR>Soon again I
    heard a tapping, something louder than before,<BR>"Surely," said I, "surely,
    that is something at my window lattice.<BR>Let me see, then, what thereat is,
    and this mystery explore.<BR>Let my heart be still a moment, and this mystery
    explore.<BR>" 'Tis the wind, and nothing more."<BR></P>
    
    
    
    <br>
    
    </div>
    <div id="bar1" style="left:15px;background-color:green;" >
    <div onmousedown="zxcSrtScroll(event,this);" unselectable="on" id="scrollbar1" style="left:0px;top:0px;background-color:blue;"></div>
    </div>
    
    <br><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
    
    <br><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
    <div>
    <a href="http://en.wikipedia.org/wiki/The_Raven">The Raven</a> by <cite><a href="http://en.wikipedia.org/wiki/Edgar_Allen_Poe">Edgar Allen Poe</a></cite>
    </div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:72px;left:425px;" onmousedown="scrll('scrollbar',-1);" onmouseup="clearTimeout(Timer);"></div>
    <div style="background:#999;height:15px;width:15px;position:absolute;top:453px;left:425px;" onmousedown="scrll('scrollbar',1);" onmouseup="clearTimeout(Timer);"></div>
    <script> vic=0; </script>
    <form name=Show id=Show style="position:absolute;visibility:visible;top:0px;left:0px;" >
    <input size=50 name=Show0 >
    <input size=10 name=Show1 >
    <input size=10 name=Show2 >
    <input size=10 name=Show3 >
    <input size=10 name=Show4 >
    <input size=10 name=Show5 >
    <input size=10 name=Show6 >
    <input size=10 name=Show7 >
    <input size=10 name=Show8 >
    <input size=10 name=Show9 >
    </form>
    
    
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #12
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you Vic. I still notice some bugs but at least I can see what is going on. I will play with this today. Thank you very much for all your time
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #13
    Regular Coder
    Join Date
    Feb 2005
    Posts
    525
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by vwphillips

    observation
    seems akward to keep using gEBId when the objects could be linked by properties to start with.
    I am working on the bar right now, I was just curious what you meant by this?
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #14
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,495
    Thanks
    3
    Thanked 500 Times in 487 Posts
    as previously posted

    Code:
     if (!scrolld.data){ scrolld.data=[parseInt(scrolld.style.top),bard.offsetHeight-parseInt(scrolld.style.height),contd,contd.scrollHeight-contd.offsetHeight ]; }
    scrolld.data is a property of the slider scrolld

    field 2 is the cotent object

    no need to gEBId that object any more

    when clicking the slider you can use the event object and get both the slider and content object

    now if you make the slider object a property of the buttons say .slider

    buttonobject.slider is the slider object

    and buttonobject.slider.data[2] is the content object
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •