Streaming live at 10am (PST)

Show a element when page its scrolling


#1

Hello,

I have a <div> element that i want to show only when the page is scroll for 200 or 300px, but sure i dont want to see this element when the page its open...i have try this jQuery but its not working good...

<script>
jQuery(document).scroll(function ($) {
    var y = $(this).scrollTop();
    if (y > 200) {
        $('.scroll_div').fadeIn();
    } else {
        $('.scroll_div').fadeOut();
    }

});
</script>

Any help its appreciated!


#2

fixed it for you. try this:

<script>
$(document).scroll(function () {
    var y = $(this).scrollTop();
    if (y >= 200) {
        $('.scroll_div').fadeIn();
    } else {
        $('.scroll_div').fadeOut();
    }

});
</script>

#3

Hello,

First thanks for your feedback smile

I have again same problem, the element its not hidden when the page its opened for first time, but when i scroll down and and go up again in top this jQuery its working.


#4
<script>
$(document).scroll(function () {
    var y = $(this).scrollTop();
    if (y >= 200) {
        $('.scroll_div').fadeIn();
    } elseif (y <= 199) {
        $('.scroll_div').fadeOut();
    }

});
</script>

also, give .scroll_div a style of display:none;


#5

Thank you PixelGeek smile

Everything works perfect now!

Best,
Deni


#6