http://jsfiddle.net/PaulNLondon/dG3Gb/
jsFiddle 显示了(我希望这是我第一次使用它)到目前为止我必须做到的地方。. . 我正在尝试使用基于图像的菜单和基于文本的翻转菜单一起工作。
我无法在 jsFiddle 中显示这一点,但我使用的图像是显示它们的分区高度的两倍,并在悬停时移动位置以显示图像的替代版本 - 在 jsfiddle 中我做了什么只是简单地为 div 的背景着色以显示它们的位置。它们的位置非常特别,以提供具有连续性的所需视觉效果。(页面标题文本和 jsFiddle 中的第一个图像块的重叠不是问题。)
我的目标是将鼠标悬停在图像上打开相关文本菜单项的粗下划线(我使用了底部边框设置)以及让图像移动以在图像菜单本身中显示替代图像。. . 并且我希望将鼠标悬停在文本菜单中的某个项目上以打开菜单项文本本身的下划线,并使图像菜单中的关联图像切换到备用图像。
我以为我几乎可以将悬停在图像上打开下划线,但似乎我制定的按 div 定位的 div 只能使用 Firefox 正确显示(如您所见,对齐在 jsFiddle 中不起作用)。
如果您有任何建议,我将不胜感激——即使您要告诉我,在您看来,我的方法都是错误的。我在这里的 CSS 和 HTML 受到了限制。我真的不知道任何 JavaScript(除了我在 Dynamicdrive 找到的幻灯片中使用过它和 jQuery)。