Jquery : addClass를 활성화하기 위해 요소 높이를 요소 높이에서 찾는다.

Jquery beginner here.Jquery : addClass를 활성화하기 위해 요소 높이를 요소 높이에서 찾는다.

현재 요소를 찾고 해당 요소에서 스크롤 위치를 기반으로 클래스를 추가/제거하려면 아래 스크립트를 사용하고 있습니다.

어두운 배경 위에 내 고정 내비게이션 아이콘의 색상을 변경하려고합니다.

현재 내 코드는 요소가 발견 된 후 사용자가 1000px를 스크롤 할 때 요소 1을 찾은 다음 요소 2에 addClass를 추가한다고 말합니다. 그것은 작동하지만 페이지가 반응적이고 섹션의 높이가 변하기 때문에 이상적이지는 않습니다. http://leebuckle.co.uk/

아이디 부 (2)의 높이가 그래서 사용자가 스크롤하면 그것을 클래스를 추가 한 후 섹션 2의 높이를 찾아 같은 :

당신은 여기에서 볼 수는, 섹션 2는 맨 위 섹션 아래의 흰색 부분입니다 + 1000px가 아닌 + (section_2 높이)가됩니다

미리 감사드립니다.

$(document).ready(function(){ 
    var div = $("#section_2"); 
    var pos = div.position(); 

$(window).scroll(function() { 
    var windowpos = $(window).scrollTop(); 

    if (windowpos >= (pos.top + 1000)) { 
    $("#nav-icon span").addClass("black_menu"); 
    } 

else { 
    $("#nav-icon span").removeClass("black_menu"); 
    } 

    }); 
});

출처

2016-06-15 Lee Buckle

당신은 문서의 상단에서 요소의 위치를 얻기 위해 jQuery를에서 offset를 사용할 수 있습니다.

if (windowpos >= (pos.top + 1000)) { ...

있다

그래서 라인과 같이 보일 수 있습니다 : 당신의 제 2 장 + .height()의 최고 위치를 얻기 위해

if (windowpos >= (div.offset().top)) { ...

출처

2016-06-15 02:26:28 mariocatch

정확히 내가 필요한 것을 고맙습니다! 이 부분은 페이지 위쪽의 고정 된 요소의 CSS를 변경하기 위해 실제로 작동한다는 것을 알았습니다. 이전과 다음 링크도 수정하고 싶습니다. 그러나이 값은 페이지 아래로 50 %이며, 창 높이를 50 % 높이고 수학에서 사용하는 방법이 있는지 알고 있습니까? 그래서 당신이 제안한 코드와 기본적으로 같지만 계산시 윈도우 높이의 50 %를 가지고 있습니까? 초보자가되어서 미안해, 여기 내 깊은 곳에서 :( –

사용 jQuery의 .offset()을 얻으려면 section2의 높이가 동적입니다.

if (windowpos >= (div.offset().top + div.height()))

출처

2016-06-15 02:32:47 typologist

Jquery : addClass를 활성화하기 위해 요소 높이를 요소 높이에서 찾는다.

답변

관련 문제