$(window).scroll(function () {
var navH = $('#ti_view').offset().top;//得到div离浏览器上边窗口的距离
var scroH = $(this).scrollTop();//得到滚动条离浏览器上边窗口的距离
if (scroH > 0) {
$('#ti_view').css({ 'position': 'fixed', 'top': 40, 'right': 50 });// fixed 浏览器窗口进行定位
} else {
$('#ti_view').css({ 'position': 'absolute', 'top': 300, 'right': 50 });//absolute绝对定位
}
});
var navH = $('#ti_view').offset().top;//得到div离浏览器上边窗口的距离
var scroH = $(this).scrollTop();//得到滚动条离浏览器上边窗口的距离
if (scroH > 0) {
$('#ti_view').css({ 'position': 'fixed', 'top': 40, 'right': 50 });// fixed 浏览器窗口进行定位
} else {
$('#ti_view').css({ 'position': 'absolute', 'top': 300, 'right': 50 });//absolute绝对定位
}
});
本文介绍了一种使用JavaScript实现的页面滚动时固定导航栏的效果。通过监听窗口滚动事件,动态调整导航栏的位置属性,实现从绝对定位到固定定位的转换。这种效果常用于网页中始终保持可见的导航栏设计。
1万+

被折叠的 条评论
为什么被折叠?



