Javascript 正在尝试淡入导航背景，而不是链接

因此，我试图仅使用jquery在导航背景中淡出，但这样做时，它也会使导航链接在导航背景中淡出

这是我的密码：

if ($(this).scrollTop() > 200) {

            $('.navigation').fadeIn(500).css('background-color', '#787878');

        } else {

            $('.navigation').fadeOut(500).not("ul li a");

        }

这是导航

`nav class="navigation" id="nav">
      <ul>
        <li><a href="#top" id="tp_link" class="active">Top</a></li>
        <li><a href="#item2" id="f_link">Item 2</a></li>
        <li><a href="#item3" id="s_link">Item 3</a></li>
        <li><a href="#item4" id="c_link">Item 4</a></li>
        <li><a href="#bottom" id="sm_link">Botton</a></li>
      </ul>
    </nav>`

`nav class=“navigation”id=“nav”>







`

我已经尝试使用

not（）

函数来省略链接，这样当用户向后滚动时，唯一剩下的就是与背景图像相关的链接本身。唯一应该消失的是它背后的背景色

---

任何关于jQuery的建议都会有所帮助。我对它非常熟悉

使用transition属性。基本上，您可以将transition属性设置为导航类的背景色，并给它一个持续时间

$（窗口）。滚动（函数（）{
如果（$（this）.scrollTop（）>200）{
$（'.navigation'）.css（'background-color'，'blue'）；
}否则{
$（'.navigation'）.css（'background-color'，'red'）；
}
});
.navigation{
高度：1000px；
背景色：黑色；
过渡色：背景色2s；
}








我大致为您编写了一段代码。下面是使用jquery仅更改背景颜色的示例

Jquery

<script type="text/javascript">
    $(document).ready(function myfunction() {
        $("#nav").css("-webkit-transition", "all 0.6s ease")
        .css("backgroundColor", "grey")
        .css("-moz-transition", "all 0.6s ease")
        .css("-o-transition", "all 0.6s ease")
        .css("-ms-transition", "all 0.6s ease");
    });
</script>


$（文档）.ready（函数myfunction（）{
$（“#nav”）.css（“-webkit转换”，“所有0.6秒轻松”）
.css（“背景色”、“灰色”）
.css（“-moz转换”，“所有0.6s轻松”）
.css（“-o-过渡”，“所有0.6s缓解”）
.css（“-ms转换”，“所有0.6s缓解”）；
});

HTML

<nav class="navigation" id="nav">
    <ul>
        <li><a href="#top" id="tp_link" class="active">Top</a></li>
        <li><a href="#item2" id="f_link">Item 2</a></li>
        <li><a href="#item3" id="s_link">Item 3</a></li>
        <li><a href="#item4" id="c_link">Item 4</a></li>
        <li><a href="#bottom" id="sm_link">Botton</a></li>
    </ul>
</nav>









是
.navigation
包含链接的
吗？实际上它更像
，链接在
元素中？我使用HTMLSo调用
$（'.navigation'）添加了导航模块。fade（）
将应用于整个
。navigation
元素包括所有子元素（即链接）。这和这篇文章的工作原理类似吗？我试图保持链接可见，尽管从向下滚动开始，父容器到达顶部时会变得半透明或不可见，但我的网站主要由白色背景组成，链接会变为透明lost@harreola只需将上面的js代码放入您的滚动功能中，并根据您的需要进行定制需要。这段代码不会影响您的导航链接随导航背景淡出。谢谢，我一回到家就会尝试：）