使用导航背景颜色滚动顶部不起作用答案

【问题标题】：Scroll top with navigation background color is not working使用导航背景颜色滚动顶部不起作用
【发布时间】：2012-10-09 11:32:08
【问题描述】：

我正在尝试创建单页网站。检查my example

在这里，click 在滚动 Top 上，click 在除 home 之外的任何导航上之后，它显示相同的导航（仅在背景颜色中）。但我需要主页导航（背景颜色），同时点击滚动Top

示例

点击关于我导航，然后点击滚动Top 它不会改变链接activebackground color

请帮帮我。

【问题讨论】：

【解决方案1】：

你可以使用：

$('#back-top a').click(function() {
  $('#nav > li.active').removeClass('active');
  $('#nav > li:first').addClass('active');
});

并添加此 CSS 样式：

li.active {
    background-color: #eee;
}

【讨论】：

【解决方案2】：

将background-attachment: fixed; 用作您的<body> 元素。

即

body {
    background:#000000 url(../images/body.jpg) no-repeat;
    font-size:14px;
    background-attachment: fixed; /* new */
}

【讨论】：

【解决方案3】：

将这两行添加到您的顶部链接点击事件中：

$('#back-top a').click(function() {
  $('#nav li.active').removeClass('active');
  $('#nav li').first().addClass('active');
}

但是必须有一种方法可以使用 pagesscroller api 来做到这一点。

编辑： 刚刚看了http://pagescroller.com/documentation/的api 有一种方法可以做到这一点，但只能使用专业版的 pagesscroller。
另一种解决方案是多次调用pagescroller的prev()函数。

【讨论】：