我正在尝试使用 jquery 为 td 的不透明度设置动画。当单击一个 td 时,我想为任何 td 设置动画并淡入已单击的 td。
我遇到了一个奇怪的闪烁问题:
被点击的 td 淡入,但随后又迅速淡入和淡出。我检查了萤火虫,该事件只被触发一次。我用无序列表尝试了相同的代码,一切都按预期工作。
任何想法为什么会发生这种情况?
我正在尝试使用 jquery 为 td 的不透明度设置动画。当单击一个 td 时,我想为任何 td 设置动画并淡入已单击的 td。
我遇到了一个奇怪的闪烁问题:
被点击的 td 淡入,但随后又迅速淡入和淡出。我检查了萤火虫,该事件只被触发一次。我用无序列表尝试了相同的代码,一切都按预期工作。
任何想法为什么会发生这种情况?
尝试添加.not($(this))
到第一个动画:
$('tr td').click(function() {
var i = $(this).index();
$('tr td').not($(this)).animate({'opacity': '0.1'});
$('tr td.item' + i).animate({'opacity': "1"});
});
此外,您需要border-collapse:separate;
在 CSS 中为表格指定。这将解决您在 Firefox 中遇到的问题:
这是为您更新的 jsFiddle > http://jsfiddle.net/s4gtp/4/
正如其他评论者所说,我没有看到任何“闪烁”,所以我假设你的意思是点击的元素淡出,然后淡入......