javascript - showhide div using scrollTop - Stack Overflow

admin管理员组

文章数量:1335590

I'm trying to create a script which would show div if 500px < scrollTop < 800px otherwise it would be hidden. So if my scroll is from 0 to 500 and from 800 and more it is hidden and between 500 and 800 it is shown. I'm new to javascript but this is what I have tried:

$(document).ready(function(){ 

$(window).scroll(function(){
    if ($(this).scrollTop() > 500) {
        $('.myDiv').fadeIn();
    } else {
        $('.myDiv').fadeOut();
    }
    if ($(this).scrollTop() > 800) {
        $('.myDiv').fadeOut();
    }
});

However after scrolling to 800 it bugs and starts endlessly hiding and showing. Any way to fix it please?

I'm trying to create a script which would show div if 500px < scrollTop < 800px otherwise it would be hidden. So if my scroll is from 0 to 500 and from 800 and more it is hidden and between 500 and 800 it is shown. I'm new to javascript but this is what I have tried:

$(document).ready(function(){ 

$(window).scroll(function(){
    if ($(this).scrollTop() > 500) {
        $('.myDiv').fadeIn();
    } else {
        $('.myDiv').fadeOut();
    }
    if ($(this).scrollTop() > 800) {
        $('.myDiv').fadeOut();
    }
});

However after scrolling to 800 it bugs and starts endlessly hiding and showing. Any way to fix it please?

• javascript

Share Improve this question Follow edited Feb 22, 2012 at 22:45 Joseph Stine 1,02211 gold badge1212 silver badges2323 bronze badges asked Feb 22, 2012 at 22:16 user1207524user1207524 36922 gold badges1313 silver badges2929 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

$(window).scroll(function(){

    if ($(this).scrollTop() > 800) {
        $('.myDiv').fadeOut();
    }
    else {
       if ($(this).scrollTop() > 500) {
           $('.myDiv').fadeIn();
       } else {
           $('.myDiv').fadeOut();
       }
    }

});

本文标签： javascriptshowhide div using scrollTopStack Overflow