[英]Div fading in and out
我需要您的帮助,我在一个网站上工作,我希望div延迟2秒,然后在单击另一个div时淡入,但是当我再次单击它(以将其关闭)时,我希望它立即淡出。 有什么帮助吗?
如果您可以使用Jquery,则以下代码将帮助您实现所需的设置:这是默认的CSS:
.invisElem{display:none}
和jQuery代码:
$('body').on('click', '.boxbutton1', function(){
var counter = $(this).data('count');
if(counter == undefined){
counter = 0;
setTimeout(function() {
$('.gymtext').fadeIn(500)//fadeIn after 2 seconds(2000 ms)
}, 2000);
}
else if(counter == 0){
$('.gymtext').fadeOut(function(){
$('.gymtext').remove()
});//fadeout quickly then remove
}
})
我想把它写下来对新手友好,如果您需要帮助添加评论
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div").fadeToggle(240);
});
});
</script>
<button>Click to fade DIV</button>
<div id="div" style="width:100px;height:100px;background-color:blue;"></div>
HTML:
<div><a href="#" id="btn">Show div1 and hide div2</a></div>
<div id="div1">Div1</div>
<div id="div2">Div2</div>
CSS:
#div2 {display:none;}
jQuery:
$('#btn').click(function(e){
$('#div1').fadeOut('slow', function(){
$('#div2').fadeIn('slow');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.