将hover状态链接到两个元素上

我有一个网格中的链接列表，以及这些链接的垂直菜单。 我正在尝试链接这两个集合，以便当您将鼠标hover在网格中的项目上时，菜单项也将突出显示，反之亦然。 这是我到目前为止所得到的：

/* Grid */ 
 
 
 /* Menu */ 
 
Menu Link 1
 
Menu Link 2
 
Menu Link 3
 
  $(document).ready(function() { $('div.count1').click(function() { $("#item177").trigger("mouseover"); }); });  

相关： 计算具有特定类的元素数，然后添加对其进行编号的ID

Answer 1

你可以试试这个

 $(document).ready(function() { $('div').hover(function() { $("ul li").eq($(this).index()).trigger("mouseover"); }, function() { $("ul li").eq($(this).index()).trigger("mouseout"); }); $('ul li').hover(function() { $(this).css('background-color', 'red'); }, function() { $(this).css('background-color', 'white'); }); });​ 

http://jsfiddle.net/LN2VL/

Answer 2

没试过，但这可能有效：

 $('.count1').hover(function(){ $('#item77').addClass('highlight'); }, function(){ $('#item77').removeClass('highlight'); });