Question

好的，我使用了这个列表布局，我希望列表行在我悬停时突出显示。现在，这不是一个问题，因为我可以使用javascript来改变类，但是我希望光标在悬停时更改为指针，当我点击时，我想要关注其中的链接。

示例代码可以在这里找到：

http://sandman.net/test/hover_links.html

我也想在其中有符合条件的链接时突出显示LI。最好使用jQuery ......有什么想法吗？

-

我已经编辑了代码以合并下面的建议，问题是当我点击LI中的其他项目时，click（）动作会触发...

-

是的，所以现在我编辑了代码。我已经在单击时应该关注的链接中添加了一个类，然后在没有此类的链接上添加了一个event.stopPropagation（），因此浏览器会相应地对它们进行操作。

再次感谢！

Answer 1

jQuery('li:has(a)')
    .css('cursor', 'pointer')
    .hover(function(){
        jQuery(this).addClass('highlight');
    }, function(){
        jQuery(this).removeClass('highlight');
    })
    .click(function(e){
        if (e.target === this) {
            window.location = jQuery('a', this).attr('href');
        }
    });

Answer 2

这对我有用

$('#element li').hover(function() { 
        $(this).animate({ 
          backgroundColor: "#4CC9F2" 
        }, "normal") 
      }, function() { 
        $(this).animate({ 
          backgroundColor: "#34BFEC" 
        }, "normal") 
      });

我使用了jquery.color.js插件，它动画效果非常好的悬停效果颜色变化

单击LI时单击链接

2 个答案: