对于我的网站,我使用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用于小窗口尺寸。]
答案 0 :(得分:0)
处理此问题的最佳方法是为这些维度插入媒体查询
@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
});
});
}