2015-01-15 4 views
0

내 사이드 ​​바 탐색을 수정하고 자체에서 작동하는 간단한 자바 스크립트 스크롤 기능이 있지만 다른 페이지 유형이 다른 스크롤 이벤트를 갖도록 조정해야합니다. 예 : 배너가있는 페이지는 고정 된 세로 막대가 세로 막대가없는 페이지와 다른 스크롤 지점에 있어야합니다.다른 상위 div에 대한 스크롤 JavaScript 함수

다른 페이지의 표시기는 배너가없는 페이지의 사이드 바가 배너가있는 페이지에없는 상위 div를 갖게됩니다. 나는 이것에 대한 나의 사용자 정의가 제한적이되도록 워드 프레스 테마를 사용하고있다. 다음은

내 예를 들어, HTML과 JS,하지만 당신은 또한 그것을 볼 수 있습니다 http://jsfiddle.net/61L4ac2j/

HTML :

<div id="mk-page-id-1" class="theme-page-wrapper mk-main-wrapper"> 
<aside id="mk-sidebar" class="mk-builtin test"> 
<div class="sidebar-wrapper" style="min-height:600px;"> 
    Page without banner example 
</div> 
</aside>   
</div> 

<div id="mk-page-id-2" class="theme-page-wrapper"> 
</div> 
<div class="theme-page-wrapper"> 
<aside id="mk-sidebar" class="mk-builtin"> 
<div class="sidebar-wrapper" style="min-height:600px;"> 
    Page with banner example 
</div> 
</aside> 
</div> 

JS : 단순화 목적

$(function() { 
var div = $(".sidebar-wrapper"); 
$(window).scroll(function() {  
    var scroll = $(window).scrollTop(); 

    if (($("sidebar-wrapper").parent().parent("mk-main-wrapper")) & (scroll > 147)) { 
     div.css("background", "yellow"); 
    } else if (scroll > 263) { 
     div.css("background", "green"); 
    } else { 
     div.css("background", "blue"); 
    } 
}); 
}); 

, 나는 배경을 사용 색상,하지만 내 실제 JS "addclass"를 사용합니다. 아래 JS 참조 :

$(function() { 
var div = $(".sidebar-wrapper"); 
$(window).scroll(function() {  
    var scroll = $(window).scrollTop(); 

    if ($("sidebar-wrapper").parent().parent("mk-main-wrapper") & scroll > 147) { 
     div.addClass("fixed-product-nav"); 
    } else if (scroll > 263) { 
     div.addClass("fixed-product-nav"); 
    } else { 
     div.removeClass("fixed-product-nav"); 
    } 
}); 
}); 

문제는 내가 JSFiddle에서 볼 수있는 첫 번째 IF 문을 참을 수 없다는 것입니다. 부모 요소가있는 것으로 보입니다.

나는 가깝고 그냥 뭔가 빠져있는 것처럼 느낍니다.

감사합니다.

답변

1

jQuery 객체는 항상 사실입니다. 길이가 0보다 큰지 확인하려면 길이를 확인해야합니다.

당신은 또한이 .

는 또한 &, 그것은을위한 &&

$("sidebar-wrapper").parent().parent("mk-main-wrapper") & scroll > 147 

$(".sidebar-wrapper").closest(".mk-main-wrapper").length && scroll > 147 
+0

감사 할 올바른 필요하지 않습니다 누락 클래스 선택이없는 당신의 응답,하지만 나에게 벌써 나는 JS에 처음 온다. 길이가 0보다 큰지 확인하는 것은 무엇을 의미합니까? – cody

+0

'.... length> 0'이지만 진실 확인으로 도망 갈 수 있습니다. 따라서 왜 내가 그것을 떨어 뜨리고 얼마 남지 않았습니다. http://stackoverflow.com/questions/7615214/in-javascript-why-is-0-equal-to-false-but-not-false-by-itself – epascarello

+0

나는 'if ($ ("sidebar -wrapper "). closest (". mk-main-wrapper "). length && scroll> 147) {'그러나 첫 번째 IF 문이 작동하지 않는 곳에서도 여전히 응답합니다. 아직도 뭔가 빠졌나요? 고맙습니다! – cody

관련 문제