对于我的网站,我使用 jquery.pagescroller.lite.js
。在 .js 文件中,我像这样初始化了函数:
$(document).ready(function(){
// initiate page scroller plugin
$('body').pageScroller({
navigation: '#nav',
scrollOffset: -195
});
});
现在,我只需要在窗口大小介于 768px 和 959px 之间时更改 scrollOffset 值,而对于其他大小则保持不变。
重要提示:请注意,对于这些窗口大小,标准导航 (#nav
) 栏已替换为移动导航栏,代码如下:
<script>
$(function(){
$('#nav').slicknav();
});
</script>
我有两个问题:
我注意到当显示移动菜单时,
pagescroller
脚本不起作用。我该如何解决?如何在我的 .css 响应文件中调用
pagescroller
以更改选项? [@Eric Whitehead 的回答可能会奏效,但我必须首先让 pagescroller 适合小窗口大小。]
最佳答案
处理此问题的最佳方法是为这些维度插入媒体查询
@media all and (max-width: 959px) and (min-width: 768px) {
.dummy-tag {
width: 255px;
}
}
然后,在你的 javascript 中,包裹你的 pagescroller
if ($(".dummy-tag").css("width") == "255px" ) {
$(document).ready(function(){
// initiate page scroller plugin
$('body').pageScroller({
navigation: '#nav',
scrollOffset: -195
});
});
}
关于javascript - 更改不同窗口大小的 pageScroller 偏移量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23375696/