Page flickers due to forced scrolling

Discussion in 'Javascript' started by Spizzat2, Mar 6, 2008.

  1. Spizzat2

    Spizzat2 Guest

    I've got some javascript that will show or hide an element on the page
    when a user activates it. The problem I'm having is that the content
    changes the length of the page, so if the user scrolls to the bottom
    of the page with the element showing, and then said user hides the
    element, the page has to shrink down back to its original length.
    The problem is that while it's shrinking, the page flickers badly. It
    looks bad enough to give someone seizures.
    I'm not sure if this happens in other browsers because the page
    currently only works in Firefox.

    I've considered just automatically scrolling to the top of the page
    when content is hidden, but I feel that could be just as disorienting
    to the user. My other thought was to include the whole result inside a
    div with a set height and allow that to scroll, but I'm not sure if
    the div would handle changing content length any better than Firefox
    does. Does anyone have experience with that?

    Basically, I'm just wondering if anyone has any suggestions on how to
    reduce/remove the effect.
    Thanks.
    Spizzat2, Mar 6, 2008
    #1
    1. Advertising

  2. Spizzat2

    SAM Guest

    Spizzat2 a écrit :
    >
    > Basically, I'm just wondering if anyone has any suggestions on how to
    > reduce/remove the effect.


    only to try to reduce : you cant want to keep same place except if you
    work with style 'visibility' instead of 'display'

    <html>
    <style type="text/css">
    div { height: 400px; border: 1px solid; margin: 10px auto; }
    div.hid { display: none }
    </style>
    <script type="text/javascript">
    function hs() {
    var d = document.getElementById('fin');
    if(d.className=='') {
    d.className ='hid';
    location = '#ok';
    }
    else {
    d.className = '';
    location = '#fin';
    }
    return false;
    }
    </script>
    <div><h2>div 1</h2></div>
    <div><h2>div 2</h2></div>
    <div id="fin"><h2>special div to hide or show</h2></div>
    <p><a href="#" id="ok" onclick="return hs();">[ Hide / Show ]</a></p>
    <div><h2>div 3</h2></div>
    </html>

    --
    sm
    SAM, Mar 6, 2008
    #2
    1. Advertising

  3. Spizzat2

    Spizzat2 Guest

    > > Basically, I'm just wondering if anyone has any suggestions on how to
    > > reduce/remove the effect.

    >
    > only to try to reduce : you cant want to keep same place except if you
    > work with style 'visibility' instead of 'display'


    Thanks for the response, but I want the stuff to change the page's
    length. I just don't like how Firefox handles it (again, I'm still not
    sure about IE). The odd thing about it is, Firefox handles horizontal
    changes just fine. It leaves the page scrolled to the right, and just
    shows nothing. Then it waits for the user to scroll left. Maybe I've
    simply found a genuine FF bug.
    Spizzat2, Mar 13, 2008
    #3
  4. Spizzat2

    SAM Guest

    Spizzat2 a écrit :
    >
    > Thanks for the response, but I want the stuff to change the page's
    > length. I just don't like how Firefox handles it (again, I'm still not
    > sure about IE). The odd thing about it is, Firefox handles horizontal
    > changes just fine. It leaves the page scrolled to the right, and just
    > shows nothing. Then it waits for the user to scroll left. Maybe I've
    > simply found a genuine FF bug.



    that smells errors about CSS

    I can't see what you say (horizontal scroll) with my little example
    given in my previous answer.

    can you give an url for a test ?

    --
    sm
    SAM, Mar 13, 2008
    #4
  5. Spizzat2

    Spizzat2 Guest

    > that smells errors about CSS
    >
    > I can't see what you say (horizontal scroll) with my little example
    > given in my previous answer.
    >
    > can you give an url for a test ?
    >
    > --
    > sm


    The horizontal scroll example was in reference to my site, not to your
    code.
    Unfortunately, I can't give the url because it's a restricted access
    site.
    Spizzat2, Mar 13, 2008
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    0
    Views:
    478
  2. Replies:
    2
    Views:
    416
    Thomas Weidenfeller
    Apr 27, 2006
  3. Fresh
    Replies:
    2
    Views:
    635
    Bo Persson
    Apr 22, 2008
  4. Replies:
    3
    Views:
    104
  5. jobs

    popup-like sticky DIV flickers ??

    jobs, Nov 20, 2006, in forum: Javascript
    Replies:
    4
    Views:
    211
Loading...

Share This Page