2013-04-02 64 views
1

在jquery文檔fadeToggle正在工作當在可見元素上調用時,如果我想在零不透明度上啓動我的元素。有沒有辦法解決這個或其他方法使用。 我不想使用顯示:無jQuery fadeToggle invisibl元素

<h2>toggle</h2> 

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

.box { 
    opacity: 0; 
} 

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

http://jsfiddle.net/A6PWN/

感謝

回答

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

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

這是使用不透明,不顯示: 沒有;

編輯:我的壞..更新它與框一起工作。 :d

+0

這是完美的,謝謝Kaloyan –

+0

不客氣。我很高興能夠提供幫助。 – Kaloyan

1

display:none作爲盒的風格,並從CSS中刪除opacity:0

你的代碼看起來應該如:

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

和CSS

.box { 
    /* no opacity here */ 
} 
+0

我不想使用顯示:無 –

+0

,那麼你可能不得不去的Kaloyan伊萬諾夫的答案 – david

0

fadeToggle();使元素風格display:none;嘗試使用animate();如果你不想「真的」消失的元素;這樣的:http://jsfiddle.net/A6PWN/1/

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

如果我想再次隱藏盒 –

+0

@的Kaloyan的回答更好的比我:) – egig

0

您可以設置不透明度爲1第一

.css('opacity', 1); 
0

使用這樣

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