0

I want to slowly fade out a div using JQuery when I start scrolling horizontally, and then Fade back in when I go back to 0 in the horizontal axis. So I have this:

    <div id="hider">Content</div>

And then the script:

    $(function() {
    $(document).scroll(function() {
    if($('body').scrollLeft() == 0)
    $("#hider").fadeIn();
    else 
    $("#hider").fadeOut();
    });
    });

and on the CSS

I have:

    #hider {
position: absolute;
left: 34px;
display: none;
    }

I saw this solution in a similar thread, but I can't get it to work.The div #hider just keeps blinking on and off as I scroll and never stops blinking

Thanks!

JDPaulsen71
  • 11
  • 5

1 Answers1

1

You are selecting a tag not an id:

Do this: add a # like this:

$("#hider").fadeIn();

see this : http://api.jquery.com/fadeIn/ and http://api.jquery.com/fadeOut/

see this for what you are trying to do.

Community
  • 1
  • 1
Adil Shaikh
  • 44,509
  • 17
  • 89
  • 111