CSS：悬停JS问题

我有一个绿色的链接，使用a：hover CSS属性。当我点击链接时，此功能被触发：CSS：悬停JS问题

$("#comment_title_link").toggle(function() { 
     $(this).text('Done'); 
     }, 
    function(){ 
     $(this).text('Add Comment title'); 
    });

它改变链接的文本。悬停属性似乎只会在你穿过它所应用的元素的边界时停止应用。但是，由于我将文本从“添加评论标题”更改为“完成”，如果将鼠标悬停在单词“标题”上并单击，“完成”显示在我的鼠标左侧，因为完成比添加评论标题。因此，即使当我的鼠标没有通过链接时，仍然应用：hover属性。我该如何解决这个问题？

来源

2011-04-07 Justin Meltzer

这是否发生在所有浏览器？这看起来像是浏览器中的DOM重绘错误。 – 2011-04-07 03:43:12

不是在Firefox中，但在铬和Safari浏览器 – 2011-04-07 03:47:39

我没有太大的帮助，但它听起来像webkit的错误。点击后，您可以尝试在链接上调用blur（）。 – 2011-04-07 03:53:06

一种解决方法是在切换（）中通过脚本删除绿色样式。当你离开并回过头来盘旋该文本时，它会再次变成绿色。

最简单的方法是只对某一类申请通过CSS悬停效果，并删除交换文本后类：

//in css: 
A.greenLink:hover 
{ 
    color: green; 
} 

// script: 
$("#comment_title_link").toggle(function() { 
    $(this).text('Done') 
      .removeClass('greenLink'); 
    }, 
function(){ 
    $(this).text('Add Comment title'); 
});

理想情况下，你会想弄清楚它的原因，以及是否有你可以做的任何事情（“正确”）。但是，如果这确实是浏览器重新绘制/渲染错误，那么也许这种解决方法（尽可能丑陋）可能会有所帮助。

来源

2011-04-07 03:53:55 Kon

你会怎么做？ – 2011-04-07 03:56:02

-1

添加一个样式：主动撤消：悬停（匹配正常样式），当它被点击时会进入：主动样式。

来源

2011-04-07 03:58:11

这个令人惊讶的不起作用 – 2011-04-07 04:04:53

那么关注点：重点？我遇到过类似的问题，这些问题之前已经修复过。 – 2011-04-07 04:11:53

CSS：悬停JS问题

回答

相关问题