Javascript 旋转时触发不透明度，jquery

单击后，图像将旋转。在图像旋转的这几毫秒之间，我需要将不透明度增加到1，当旋转停止时-不透明度变回默认值。3

我想我需要一个条件语句

$("#image").css('opacity','.3');
var value = 0;
$( "li" ).click(function() {
    var text=$(this).text();
    if(text==="Link1"){value=0;}
    if(text==="Link2"){value=20;}
    if(text==="Link3"){value=40;}
    $("#image").rotate({ animateTo:value});
    while {
        $("image").animate({opacity:'1'},{duration:300});
    } 
    else {
        $("image").animate({opacity:'.3'},{duration:300});
    }
});

不确定

.animate

和

duration

是否是最佳实践

这里没有条件语句。对于给定的示例，它不起作用。在示例中，即使在动画上，图像的不透明度也是.3，这是不受欢迎的

---

希望解决方案不远…

您可以在

旋转

函数中使用回调参数在旋转完成后调用函数，如下所示

已编辑

$("#image").css('opacity','.3');
var value = 0;
var prev_value = 0;
$( "li" ).click(function() {
    var text=$(this).text();
    if(text==="Link1"){value=0;}
    if(text==="Link2"){value=20;}
    if(text==="Link3"){value=40;}
    if(prev_value != value){
        $("#image").animate({opacity:'1'});
        $("#image").rotate({
            animateTo:value,
            callback: function(){$("#image").animate({opacity:'0.3'});}
        });
    }
    prev_value = value;
});

---

这是..

您可以检查是否更改了旋转角度的值。如果你改变了它，然后改变不透明度，否则什么也不做

试试这个：

$("#image").css('opacity','.3');
var value = 0,last=0;
$( "li" ).click(function() {
    var text=$(this).text();
    if(text==="Link1"){value=0;}
    if(text==="Link2"){value=20;}
    if(text==="Link3"){value=40;}
    $("#image").rotate({ animateTo:value});
    if(last!=value){
    $("#image").animate({opacity:'1'},300,function() {
    $("#image").animate({opacity:'0.3'},{duration:300});
    });}
    last=value;
  });

---

我刚刚访问了我的链接，它工作正常。^如果您不介意，请进一步解释..@user26409021但有一件事。。。重复单击时，图像保持不透明度1。我怎样才能防止这种情况发生？请查看我编辑的答案。。这是因为rotate函数不调用回调函数。。因此，解决方法是添加另一个变量来比较当前值和以前的值。。