【JQuery】ページスクロールして指定要素の位置でfixedを解除する
ページスクロールの途中で指定要素の位置に来たらfixedが解除されるJQueryです。
JQuery
$(document).ready(function(){ var fixedElm = $('.fixedBox'); // fixedする要素 var cancellationElm = $('.sectionBox'); // これの位置に来たらfixedが解除される要素 var fixedHeight = fixedElm.height(); // fixedする要素の高さを取得 var cancellationVal = cancellationElm.offset().top - $(window).height() + fixedHeight; // fixed解除するための基準となる値を取得 $(window).on('scroll',function(){ if ($(window).scrollTop() < cancellationVal) { fixedElm.css('position', 'fixed'); } else { fixedElm.css('position', 'relative'); } }); });
コメントを残す