다른 jQuery 함수가 호출되었을 때 jQuery 함수가 종료 된 것처럼 보입니다.

Question

특정 스크롤 지점 이후에 화면에 고정 된 사이드 바를 유지 한 다음 맨 위로 스크롤 할 때 상대 위치로 돌아 오는 자체 함수를 작성했습니다. 창 크기가 사이드 바 높이보다 작은 경우 창 크기가 조정되면 정상적인 상대 위치로 돌아갑니다. 위대한 작품!

페이지의 본문에있는 파노라마 미리보기 이미지에서 fancybox()와 같은 다른 기능을 실행하고 스크롤을 시도 할 때 내 원래의 "스크롤 수정"기능이 작동하지 않는 것 같습니다.

누구나 알고 계십니까?

////////////////////
Demo Page
////////////////////

////////////////////////////////////
"스크롤 - 수정 "함수

$(document).ready(function(){ 

    var element = $("#sidebar"); 
    var window_height = $(window).height(); 
    var element_height = element.height(); 

    $(window).ready(function() { 
    if (window_height > element_height) { 
     if (($(document).scrollTop() + element.height()) > ($(document).height() - $("#footer").height() - 9)) { 
     element.css("position","absolute"); 
     element.css("top", "auto"); 
     element.css("bottom","-60px"); 
     } 
     else if ($(document).scrollTop() > 220) { 
     element.css("position","fixed"); 
     element.css("top","9px"); 
     element.css("padding-top","0"); 
     element.css("bottom","auto"); 
     } 
     else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto");  
     } 
    } 
    else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto"); 
    } 
    }); 


    $(window).scroll(function() { 
    if (window_height > element_height) { 
     if (($(document).scrollTop() + element.height()) > ($(document).height() - $("#footer").height() - 9)) { 
     element.css("position","absolute"); 
     element.css("top", "auto"); 
     element.css("bottom","-60px"); 
     } 
     else if ($(document).scrollTop() > 220) { 
     element.css("position","fixed"); 
     element.css("top","9px"); 
     element.css("padding-top","0"); 
     element.css("bottom","auto"); 
     } 
     else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto");  
     } 
    } 
    else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto"); 
    } 
    }); 

    $(window).resize(function(){ 
    window_height = $(window).height(); 
    if (window_height > element_height) { 
     if (($(document).scrollTop() + element.height()) > ($(document).height() - $("#footer").height() - 9)) { 
     element.css("position","absolute"); 
     element.css("top", "auto"); 
     element.css("bottom","-60px"); 
     } 
     else if ($(document).scrollTop() > 220) { 
     element.css("position","fixed"); 
     element.css("top","9px"); 
     element.css("padding-top","0"); 
     element.css("bottom","auto"); 
     } 
     else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto");  
     } 
    } 
    else { 
     element.css("position","relative"); 
     element.css("top","auto"); 
     element.css("padding-top","57px"); 
     element.css("bottom","auto"); 
    } 
    }); 

}); 

Answer 1

첫 번째 변화는

(function($) { 
    $.fn.myScrollFix = function(options) { 

     options = $.extend({ 
      footer: "footer", 
      pthis: this, 
      doc: $(document), 
      win: $(window) 
     }, options || {}); 

     options.footer = $(options.footer); 
     options.accion = function() { 

      var element = options.pthis, 
       doc_scroll_top = options.doc.scrollTop(), 
       doc_height = options.doc.height(), 
       window_height = options.win.height(), 
       element_height = options.pthis.height(), 
       footer_height = options.footer.height(); 

      if (window_height > element_height) { 
       if ((doc_scroll_top + element_height) > (doc_height - footer_height - 9)) { 
        element 
         .css("position","absolute") 
         .css("top", "auto") 
         .css("bottom","-60px"); 
       } 
       else if (doc_scroll_top > 220) { 
        element 
         .css("position","fixed") 
         .css("top","9px") 
         .css("padding-top","0") 
         .css("bottom","auto"); 
       } 
       else { 
        element 
         .css("position","relative") 
         .css("top","auto") 
         .css("padding-top","57px") 
         .css("bottom","auto");  
       } 
      } 
      else { 
       element 
        .css("position","relative") 
        .css("top","auto") 
        .css("padding-top","57px") 
        .css("bottom","auto"); 
      } 
     }; 

     $(window).bind("scroll", options.accion); 
     $(window).bind("resize", options.accion); 

     options.accion(); 
    }; 
})(jQuery); 
$(document).ready(function(){ 
    $("#sidebar").myScrollFix(); 
}); 

다음 라인

FancyBox

에이 라인을 수정할 수 있습니다 같은 문제를 발생시키지 432

$(window).unbind("resize scroll", $.fn.fancybox.scrollBox); 

라인 439

$(window).unbind("resize scroll", $.fn.fancybox.scrollBox); 

Answer 2

과제를 해결한다.

창을 바인딩 해제하는 것은 내 스크롤 수정 솔루션뿐만 아니라 바인딩 해제됩니다

if (opts.centerOnScroll) { 
    $(window).unbind("resize scroll"); 
} 

... 당신은 멋진 상자를 닫을 때 FancyBox.js 기본적라는 한 줄, 을 가지고 밝혀졌습니다.

해당 줄의 간단한 주석 처리 (fancybox 닫기 함수에서 두 번 발생)는이 문제를 수정합니다. 이 코드에 대한

if (opts.centerOnScroll) { 
// $(window).unbind("resize scroll"); 
} 

Answer 3

나는 매우 비슷한 문제가있어서 의견을 말하려했지만 노력했지만 다른 해결책을 시도했지만 효과가있었습니다. 기본적으로, 내 경우에는

$(window).unbind('scroll', $.prettyPhoto.close); 

굵은 부분 은 $ .prettyPhoto.close 내가 추가 한 것입니다 prettyPhoto이었다 닫기 스크롤 만 필요한 것을 실제 요소를 대상으로.

prettyPhoto에서이 스크롤을 닫은 문제를 해결 한 사람에게 도움이되기를 바랍니다.