jQuery slideTo切换开始褪色

我想使用jQuery在单击按钮时切换0.3和1.0之间的元素的不透明度。
我遇到的问题是，以0.3的不透明度启动元件，然后在第一次单击时使其完全可见，并使用1.0不透明度。我已经试过代码如下：jQuery slideTo切换开始褪色

$(document).ready(function(){ 

    //Start faded to 0.3 
    $(".fadingElement").fadeTo(0, 0.3); 

    //When the trigger is clicked first, fade the relevant item back up to 1.0 
    $("div.trigger").toggle(
     function(){ 
      $(this).parent().next().fadeTo('fast', 1.0); 
     }, 
     function() { 
      $(this).parent().next().fadeTo('fast', 0.3); 
     } 
    ); 
});

当点击“div.trigger”，它不褪色了，就再点击时，它消失将另外0.3！当第三次点击时，它会消失到0.3的起始点。

如何在0.3处启动元素，并在第一次点击时将其恢复为完全可见（1.0）？这里发生了什么？

来源

2011-08-02 Mikey

对我来说似乎没问题（在Chrome中测试过）：http://jsfiddle.net/FVjnX/ –

它也适用于我做的测试，就像@James Allardice – jackJoe

Ahhh您的jsfiddle测试也适用于我！但我的代码不是。究竟是什么...... – Mikey

问题（根据您的提琴的代码）是，你真的想淡出元素是<div class="student_notified"> ，但是您的代码正在淡化该div的父级，而不是div本身。

可以使用find方法到其父项内选择正确的元素：

$(this).parent().next().find(".student_notified").fadeTo('fast', 0.3);

这里是一个updated fiddle。

来源

2011-08-02 09:22:46

工作。谢谢詹姆斯，你太棒了！ – Mikey

你可以简单地使用.animate()与.css('opacity',value)实现这一行为

例子：

$("div.trigger").toggle(
$(this).parent().next(); 
    $(this).parent().next().animate({opacity:1.0}); 
}, 
function() { 
    $(this).parent().next().animate({opacity:0.3}); 
    }); 
} 
);

来源

2011-08-02 08:41:57 Semyazas

我实际上已经尝试过，结果完全一样......嗯，真的很想深究这一点。 – Mikey

您正在使用哪种浏览器？ – Semyazas

Firefox，与Safari相同的结果 – Mikey

jQuery slideTo切换开始褪色

回答

相关问题