Div不會第一次用jQuery淡出？

我想在onClick一個div褪色，並且點擊在div的東西時，再次淡出。但是，出於某種原因，我第一次試圖展示它剛剛出現的div，但是它第一次隱藏並顯示其他每個展示/隱藏時，它都會正常消失。下面是我對淡入淡出功能：Div不會第一次用jQuery淡出？

<script> 
    function show_eform() { 
     document.getElementById('eform').style.visibility = 'visible'; 
     $('#eform').fadeIn('fast'); 
    } 
    function hide_eform() { 
     $('#eform').fadeOut('fast', function(){ 
      document.getElementById('eform').style.visibility = 'hidden'; 
     }); 
    } 
</script>

而對於div的CSS：

background: rgba(0, 0, 0, 0.5); 
margin: auto; 
position: absolute; 
left: 0px; 
top: 0px; 
width: 100%; 
height: 100%; 
z-index: 50; 
visibility: hidden;

要觸發：

<a href="#" onclick="show_eform()">

來源

2012-11-13 tkbx

你不需要像這樣混合使用jQuery和vanilla DOM。 –

@MattBall這是特別糟糕的做法嗎？ – tkbx

你可以發佈調用這些函數的代碼嗎？ – Catfish

試試這個

function show_eform() { 
    $('#eform').fadeIn('fast'); 
} 

function hide_eform() { 
    $('#eform').fadeOut('fast'); 
}

而且使用display: none;而不是visibility: hidden;，如：

background: rgba(0, 0, 0, 0.5); 
margin: auto; 
position: absolute; 
left: 0px; 
top: 0px; 
width: 100%; 
height: 100%; 
z-index: 50; 
display: none;

來源

2012-11-13 18:00:47 Alfo

這裏是一個小提琴，可以幫助你瞭解淡入/淡出和切換功能： http://jsfiddle.net/g9AU9/1/

對於淡入/淡出/切換型功能，您不必設置任何知名度狀態，這些功能爲你照顧它。

HTML

<div id="eform" style="display:none;">This is an eform</div> 
<div class="toggle_form">Toggle Eform</div> 
<div class="hide_form">Hide Eform</div>

CSS

#eform { background:orange; padding:10px; } 
.toggle_form { background:yellow; padding:10px; cursor:pointer; } 
.hide_form { background:lime; padding:10px; cursor:pointer; }

show_eform(); 

function show_eform(){ 
    $('#eform').fadeIn('fast'); 
} 

function hide_eform() { 
    $('#eform').fadeOut('fast'); 
    $(".toggle_form").hide(); 
} 

$(".toggle_form").click(function() { 
    $('#eform').slideToggle('fast'); 
}); 

$(".hide_form").click(function() { 
    hide_eform(); 
});

來源

2012-11-13 18:05:49 Lowkase

document.getElementById('eform').style.visibility = 'visible';

這條線，你直接顯示div中只是刪除線，只是淡入和淡出功能你也不需要設置visibi在動畫結尾的可愛。

來源

2012-11-13 18:17:44

Div不會第一次用jQuery淡出？

回答

相關問題