javascript - jQuery 悬停时不会褪色

Question

我有一个表格，每次有人将鼠标悬停在单元格上时，我希望它变得不透明(不透明度默认为 0.85)。这是我的代码:

$(document).ready(function(){

    $("td").hover(function(){

        $(this).fadeTo(700,1);

            },function(){

        $(this).fadeTo(500,0.85);

    }); 
});

编辑:问题似乎可能是当我悬停时没有任何东西触发，即使我将 alert('hi') 添加到函数中，也没有任何反应

编辑2:如果有人仍然阅读这个问题，我相信当我问这个问题时它不起作用的原因是因为我正在异步创建 td 元素，并且在加载页面时它们不存在。我相信我最终使用了 .on() 而不是 .hover()。另外，褪色到 1.0 不透明度是理想的效果(我忘了它是从 0.85 或 0.5 开始的)。谢谢大家

Answer 1

只需使用CSS

td {
    opacity: .85;    
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}
td:hover {
    opacity: .5;    
}

演示:http://jsfiddle.net/maniator/bnrWK/