2012-01-15 6 views
1

그래서 페이지 아래쪽으로 스크롤하면 div가 생깁니다. 해당 div에는 다시 슬라이드하는 "X"앵커가 있습니다 (jQuery에 있음). 하지만 스크롤하면 div가 자연스럽게 아래로 내려갑니다. 그래서 X를 제일 먼저 만들고 "#topDiv"를 위로 슬라이드시킨 다음 slideDown하는 함수를 무시하십시오.기능을 무시 하시겠습니까?

전체 코드 :

$("#topDiv").hide(); 

    $(window).scroll(function() { 
     if ($(window).scrollTop() + $(window).height() > $(document).height() - 500) { 
      $("#topDiv").slideDown(); 
     } 


     if ($(window).scrollTop() + $(window).height() < $(document).height() - 800) { 

      $("#topDiv").slideUp(); 
     } 
     $("#closeTop").click(function() { 
      $("#topDiv").slideUp(); 
      return false; 
     }); 
    }); 

Demo Page (http://tutorials.underbakke.net/js/function/)

답변

-1

이 시도 :

$("#topDiv").hide(); 

$(window).addEventListener('scroll', function(event) { 
    if ($(window).scrollTop() + $(window).height() > $(document).height() - 500) { 
     $("#topDiv").slideDown(); 
    } 


    if ($(window).scrollTop() + $(window).height() < $(document).height() - 800) { 
     $("#topDiv").slideUp(); 
    } 

    $("#closeTop").click(function() { 
     $("#topDiv").slideUp(); 
     $(window).removeEventListener('scroll',arguments.callee,false); 
    }); 
} 
3

당신은 "X"후 slidedown 바인딩을 해제하기 위해 온/오프 방법을 사용할 수있다 클릭 수

$("#topDiv").hide(); 

$(window).on('scroll', showTopDiv); 

function showTopDiv() { 
     if ($(window).scrollTop() + $(window).height() > $(document).height() - 500) { 
      $("#topDiv").slideDown(); 
     } 
} 

$(window).on('scroll', function() { 
     if ($(window).scrollTop() + $(window).height() < $(document).height() - 800) { 
      $("#topDiv").slideUp(); 
     } 
}); 

$("#closeTop").click(function() { 
     $("#topDiv").slideUp(); 
     $(window).off('scroll', showTopDiv); 
     return false; 
}); 

또한 슬라이드 업 함수에서 $("#topDiv").is(':visible')을 if 문에 추가하면 실행되지 않는 것이 확실합니다.

그리고 스크롤 할 때마다 클릭 기능을 바인딩해야 할 필요가 있습니까?

관련 문제