SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Thread: window problem

  1. #1
    SitePoint Guru
    Join Date
    May 2012
    Posts
    996
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Post window problem

    Hi, I need some help regarding on my page,how can i make my page when i will refresh or ctrl+F5 i want that my vertical scroll bar from the window will be on top so that the middle part of my page will not be seen.because i want by default the scroll bar will always on the top.

    Thank you in advance.

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,312
    Mentioned
    178 Post(s)
    Tagged
    8 Thread(s)
    Hi jemz,

    I was actually surprised at how difficult this was to achieve in a cross-browser compatible way.
    The secret was to wrap the call to scrollTop() in a setTimeout(), so that the browser has time to position itself before you reset the scroll position.

    Here's the code:

    HTML Code:
    <!DOCTYPE HTML>
    <html>
      <head>
        <!-- [url]http://www.sitepoint.com/forums/showthread.php?977666-window-problem[/url] -->
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Set scrollTop</title>
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <style>#main{ background:green; height:3000px; width:500px; }</style>
      </head>
      
      <body>
        <div id="main">
        <h1>Test Div</h1>
        </div>
        <p>Test Paragraph</p>
        <script>
          $(document).ready(function() {
            setTimeout(function() { $("html, body").scrollTop(0); }, 150);
          });
        </script>
      </body>
    </html>

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,598
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    You should be able to do it without needing JQuery using the following JavaScript:

    Code:
    setTimeout(function() {window.scrollTo(0,0);},150);
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,312
    Mentioned
    178 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by felgall View Post
    You should be able to do it without needing JQuery
    Yup, fair point!

  5. #5
    SitePoint Guru
    Join Date
    May 2012
    Posts
    996
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you felgal

  6. #6
    SitePoint Guru
    Join Date
    May 2012
    Posts
    996
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you pullo


Bookmarks

Posting Permissions

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