水平菜单悬停div内容显示

Question

我的html页面中有两个div元素。左侧div包含锚元素的水平列表。右侧div包含鼠标悬停在其上的当前锚元素的内容，当我将鼠标悬停在左侧div中存在的链接上时，它应该发生变化当我将鼠标悬停在外部时，最后一项内容应显示在div右侧。

使用javascript或jquery有帮助吗？

Answer 1

您可以将data-showdiv属性添加到带有div ID的链接中。 将所有具有类和ID的内容div放在display：none中； 然后用jquery：

$('a.item').hover(function(){
   $('.class').hide();
   $('#'+$(this).data('showdiv')).show();

});