0

对于我的网站,我使用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>

我有两个问题

  1. 我注意到pagescroller显示移动菜单时脚本不起作用。我该如何解决?

  2. 如何pagescroller在我的 .css 响应文件中调用以更改选项?[可能@Eric Whitehead 的答案会起作用,但我必须首先让 pagescroller 用于小窗口尺寸。]

4

1 回答 1

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
    });         
 });
}
于 2014-04-29T21:37:43.417 回答