JQuery动画化带有表格的回调函数
我在这里有一个罕见的情况，我需要一些想法，我只是证明了许多组合，但编程不是随机的！
我有一个边框为1px的表格。我也有很多<td>，里面有一张图片。基本上我的想法是，当用户点击一个图像(img)时，所有的图像和表格边框都会“淡出”，除了被点击的图像。所以我已经证明了很多组合，当img消失时，没有边框，或者什么都没有消失，或者一切都消失了，或者回调不起作用。到目前为止，我最好的方法是：
建议使用以下html：
<table id="entire">
<tr><td>
<table class="table1" border="1px">
<tr>
<td><img id="ebox"></td>
<td><img id="fbox"></td>
<td><img id="gbox"></td>
</tr>
</table>
</td></tr>
</table>并提出以下JQuery：
$("#entire").click(function (event) {
$('.table1 img').animate({
opacity: 0.3
}, 500,
function() {
}); //close the animate
$('#' + event.target.id).animate({
opacity: 0.9
}, 500,
function() {
}); //close the animate
}); //close the event click我真的用一切证明了这一点，使用ParentNode和call，以及其他选项，比如淡出然后淡出。
在最后一个例子中，我知道这是可以做到的，但我不知道该怎么做。我的想法是，table1会“淡出”，除非图像被点击，而且不是在之后，而是在同一时间。
任何变通方法也将被视为解决方案，请在投票前发表评论，询问更多信息或提出建议。我真的在Google上搜索，我也试着用"queue off，complete:“，但不起作用。
更新：
最后一种方法：
$('.table1 img').not(event.target).animate({alpha: 0.3}, {
duration: 1000,
step: function() {
$('.table1').css('border-color','rgba(0,0,0,'+this.alpha+')');
}
});回答 1
Stack Overflow用户
发布于 2012-09-12 06:32:48
jQuery UI允许使用彩色动画，因此如果安装了jQuery UI (或其适当的部分)，请尝试以下操作：
var $t = $("#entire table").on('click', 'img', function() {
$(this).fadeIn(250);
$t.animate('border-color', '#FFF').find('img').not(this).fadeOut(1000);
});您只能看到一次边框淡入淡出效果，除非其他代码将其重置为其原始颜色。
编辑
.fadeTo()可能比fadeIn() /fadeOut()更好，因为淡入淡出的图像仍然可以点击。
var $t = $("#entire table").on('click', 'img', function() {
$(this).fadeTo(250, 1.0);
$t.animate('border-color', '#FFF').find('img').not(this).fadeTo(1000, 0.2);
});https://stackoverflow.com/questions/12377775
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号