Скрипт

A
На сайте с 15.03.2018
Offline
6
499

Добрый день!

Помогите доработать скрипт (объясните дуре) фиксирующий блок после его прокрутки.

Необходимо, чтобы див #made перестал быть липким ( он это делает путём добавления элементу класса "fixedDiv") при попадании в футер.

$(function(){

'use strict';
var offset=$('#made').offset();
$(window).scroll(function(){
if($(window).scrollTop()>offset.top){
$('#made').addClass('fixedDiv');
} else {
$('#made').removeClass();
}


});
});
MG
На сайте с 21.01.2011
Offline
91
#1

отписал в личку, но у меня твой код заработал, вот пример:


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1 id="made">test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
<h1>test</h1>
</body>
<script src="jquery.js"></script>
<script>
$(function () {
'use strict';
var offset = $('#made').offset();
$(window).scroll(function () {
let scrollTop = $(window).scrollTop();
console.log("a: " + scrollTop, offset.top, scrollTop > offset.top);
// if (scrollTop > offset.top) {
// $('#made').addClass('fixedDiv');
// } else {
// $('#made').removeClass();
// }


});
});
</script>
</html>
A
На сайте с 15.03.2018
Offline
6
#2

В общем, проблему решила окольными путями - простановкой z-index у липкого блока и футера

dkameleon
На сайте с 09.12.2005
Offline
386
#3

вы чтоли хотите на коленке реализовать то, что уже есть в ЦСС?

position: sticky

Дизайн интерьера (http://balabukha.com/)
A
На сайте с 15.03.2018
Offline
6
#4
dkameleon:
вы чтоли хотите на коленке реализовать то, что уже есть в ЦСС?

position: sticky

Если я правильно понимаю, то поддержка у него осуществляется не всеми браузерами: https://caniuse.com/#feat=css-sticky

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий