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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts

    javascript floating menu timing

    Hello everyone,

    I tried to create javascript float menu and this my code:

    Code:
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    
    <body>
    <div id="static" style="width:150px; height:150px; position: absolute; border:1px solid yellow; right: 5px;">HELLO</div>
    
    <script type="text/javascript">
    setInterval("document.getElementById('static').style.top=document.body.scrollTop+25+'px' ",1000).setTimeout(100);
    </script>
    <br /><br /><br />
    
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />'
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    text-here
    text-here
    text-here
    text-here
    text-here<br /><br /><br />
    </body>
    </html>
    but the results it's not good like: http://www.jtricks.com/javascript/na.../floating.html

    what's the lack or mistake of my script?

    please help me

    thank you

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    That .setTimeout(100) on the end of your code is WRONG. Totally bogus.

    Your real problem is that you are asking the scroller to reset its position ONLY ONE TIME PER SECOND. Just change the interval to something MUCH smaller.

    Code:
    setInterval("document.getElementById('static').style.top=document.body.scrollTop+25+'px' ",40);
    </script>
    In addition to getting rid of the setTimeout, of course.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

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