※ 스크립트가 꺼져있습니다. 원활한 사이트 이용을 위해 스크립트를 다시 허용해주세요.

[jQuery] 스크롤시 class 추가/제거

방법1

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
jQuery(document).ready(function() {
	var bodyOffset = jQuery('body').offset();
	jQuery(window).scroll(function() {
		if (jQuery(document).scrollTop() > bodyOffset.top) {
			jQuery('header').addClass('scroll');
		} else {
			jQuery('header').removeClass('scroll');
		}
	});
});
</script>

화면을 스크롤 하면 header 에 scroll 이라는 class 가 추가된다.

방법2

$(window).scroll(function() {
	var scroll = $(window).scrollTop();
	//console.log(scroll);
	if (scroll >= 50) {
		//console.log('a');
		$(".header").addClass("change");
	} else {
		//console.log('a');
		$(".header").removeClass("change");
	}
});

https://jsfiddle.net/19bwe33x/12/

태그 목록