简体繁体 English

导航菜单

[英]Navigation menu

原文 2010-06-14 13:12:02 3 3 javascript

When I take mouse over the Navigation menu links (About Us..), the page moves to left. 当我将鼠标悬停在“导航”菜单链接（“关于我们”）上时，页面将移至左侧。 Is that due to javascript? 那是由于javascript吗？

link text 连结文字

3 个解决方案

It's because of the scrollbar that appears at the browser window's right side. 这是因为滚动条显示在浏览器窗口的右侧。 It seems to me that there is a design error causing the content to be much larger with the menu hovered ... 在我看来，有一个设计错误导致菜单悬停时内容要大得多。

if you hover the menu, the page gets so long that scrollbars occur - and that causes the page to "move to left" (it stays in the center of your viewport, which is what it should do). 如果将鼠标悬停在菜单上，则页面将变得很长，以至于出现滚动条-并导致页面“向左移动”（它停留在视口的中央，这是应该执行的操作）。 to fix this, find out whats causing this overflow (the page isn't looking that long, i don't know where the scrollbars come from) or set overflow-y:scroll for your body, so there's always a scrollbar (which would be the bad "i don't know what else to do to fix this"-solution) 要解决此问题，请找出导致此溢出的原因（页面看起来时间不长，我不知道滚动条从何而来）或为您的身体设置overflow-y:scroll ，所以总会有一个滚动条（是不好的“我不知道该怎么解决”的解决方案）

Try moving the UL dropdown elements away from the bottom of the page or set them to display:none until after you've absolutely positioned them at the top of the page. 尝试将UL下拉元素从页面底部移开或将它们设置为display:none直到将它们完全定位在页面顶部为止。 visibility:hidden does not take the elemtens out of the flow of the document but just hides them. visibility:hidden不会将元素从文档流中移出，而只是将它们隐藏起来。

A better bet though would be to make them children of the <a> tags you already have, so they only need to be displayed rather than displayed and moved. 更好的选择是使它们成为您已经拥有的<a>标记的子代，因此只需要显示它们，而不是显示和移动它们。