我有一个顶部固定div,然后是一个主框架,里面包含两个div(左和右)。 我想在滚动的顶部栏下方制作正确的div棒。
我已经把我所拥有的东西放在这里: http://jsfiddle.net/mhD9Y/2/
$(document).ready(function(){
var window_top = 41 - $(window).scrollTop();
var div_top = $('#stop_scroll').offset().top;
if (window_top > div_top)
$('#right').addClass('stick');
else
$('#right').removeClass('stick');
});
.stick {
position: fixed !important;
top: 41px !important;z-index: 5 !important; -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
事情是脚本根本没有启动。
谢谢
答案 0 :(得分:4)
使用窗口滚动显示代码。
$(document).ready(function(){
$(window).scroll(function(){
var window_top = $(window).scrollTop() - 41;
var div_top = $('.right').offset().top;
if (window_top > 41) {
if (!$('.right').is('.stick')) {
$('.right').addClass('stick');
}
} else
$('.right').removeClass('stick');
});
});
您可以将id =“right”更改为class =“right”
OR
更改
的css.stick并在每个属性的末尾添加!important。
答案 1 :(得分:1)
脚本:
$(document).ready(function(){
$(window).scroll(function(){
var window_top = $(window).scrollTop() - 41;
var div_top = $('#stop_scroll').offset().top;
console.log(window_top, div_top);
if (window_top > div_top) {
$('#right').addClass('stick');
} else {
$('#right').removeClass('stick');
}
});
});
CSS:
.stick {
position: fixed !important;
top: 41px !important;
}