0

各位程序员，您好，我是 HTML5/CSS/Javascript 编程的新手，我会尽量让我的问题尽可能清晰。

我在我的网站上使用了滚动魔法，让导航链接在您向下滚动时滚动到一边。这是该页面的链接。尽管如此，我已经意识到，当我这样做时，当导航链接和我的图像元素（上面有链接区域）处于相同的横向水平时，我不能再单击下面的图像：Scrollmagic 链接移动阻止了其他图像链接。即使导航链接和缩略图链接处于同一级别，我也希望能够在整个视差滚动过程中仍然单击这两个链接。

我试图：更改两个元素的 z 值，更改 .site-nav 和 page-nav 的大小，并花了很多时间尝试编辑零碎的内容，看看是否可以解决问题，但一切都是为了徒劳无功。这是我认为答案所在的部分css，但我可能错了。

用于视差导航链接的 CSS：

.site-nav {
display: block;
position: fixed;
width: 100;
text-align: center;}

图像缩略图链接的 CSS（带有 HR 图像的链接）：

.page-nav {
display: block;
width: 100%;
text-align: center;
z-index: 10;
margin-top: 300px;

}

因此，如果这听起来对您来说是一个简单的答案，那真的会对我有很大帮助。希望我的帖子是相关的，有意义的！让我知道是否有任何需要澄清的地方。

4

1 回答 1

0

这是不可能的。您有一个位置固定的无序列表。列表的宽度跨越整个页面，并且会阻止您单击该导航容器下方的元素。这可以通过使用 Chrome 的开发工具看到（见我的截图）。您可能想尝试的一件事是在元素向右滑动后减小容器的宽度，但这意味着更多地进入 javascript。

开发者工具预览

于 2015-02-28T21:07:35.717 回答