Question

在Jquery文档中，fadeToggle正在工作当在可见元素上调用时，如果我想在零不透明度上启动我的元素该怎么办？有没有办法解决这个或任何其他方法使用。我不想使用display：none

<h2>toggle</h2>

<div class="box">box</div>

.box {
   opacity: 0;
}

$('h2').click(function(){
   $('.box').fadeToggle();
});

http://jsfiddle.net/A6PWN/

由于

Answer 1

将display:none作为框的样式并从css中删除opacity:0

您的代码应如下所示：

<h2>toggle</h2>
<div class="box" style="display:none">box</div>

和CSS

.box {
   /* no opacity here */
}

Answer 2

fadeToggle();如果您不想“真正”消失该元素，请将元素样式display:none;尝试使用animate();;这个：http://jsfiddle.net/A6PWN/1/

$("h2").click(function () {
  $(".box").animate({
    opacity: 1,
  });
});

Answer 3

您可以将不透明度设置为1

.css('opacity', 1);

Answer 4

像这样使用

$('h2').click(function(){
    $('.box').css('opacity', 1);
    $('.box').fadeToggle();
});

Answer 5

$('h2').click(function() {
    var boxOpacity = parseInt($('.box').css('opacity'));
    $('.box').animate({
        opacity: boxOpacity == 0 ? 1 : 0
    });
});

http://jsfiddle.net/A6PWN/4/

这是使用不透明度，而不是显示：无;

编辑：我的不好..更新它以使用该框。：d

jQuery fadeToggle on invisible element

5 个答案: