jquery hide,show方法问题?

有AB 2个层,B在A里面,初始display都是none,首先是显示效果,A.show()后B.show('500'); 效果正常:A层先显示,B层以500的速度匀速逐渐显示
但是隐藏出现了问题,希望达到的效果是B层先以500的速度hide,然后A再hide,但无论如何顺序,都是AB一起瞬间都隐藏掉了,请问有没有办法在隐藏的时候,让B确实先执行完.hide('500')后再让A.hide()?

交互式爱情
浏览 505回答 1
1回答

湖上湖

在jquery中我显示与隐藏元素可以直接使用show()和hide()来操作,这比起js中的操作要方便了,同时show()和hide()还可以 设置参数让我们的运行有个缓存效果首先来看个段落文字的显示和隐藏1:show() 方法显示出隐藏的 <p> 元素。代码如下:$(".btn2").click(function(){$("p").show();});2:hide()隐藏可见的 <p> 元素:代码如下:$(".btn1").click(function(){$("p").hide();});3:jQuery代码如下:$("element").show("slow");运行该代码后,元素将在600毫秒内慢慢的显示出来。其它的速度关键字还有”normal“和”fast“(长度分别是400毫秒和200毫秒)。不仅如此,还可以为显示速度指定一个数字,单位是毫秒。例如,使用如下代码使元素在1秒钟(1000毫秒)内显示出来;$(”element").show(1000);在前面的例子中,把其中的hide()方法改为hide(600),show()方法改为show(600)。jQuery代码如下:$(function () {$("#panel h5.head").toggle(function () {$(this).next().hide(600);}, function () {$(this).next().show(600);})});从代码的执行过程中,可以发现,hide(600)方法会同时减少“内容”的高度、宽度和不透明度,直至3个属性的值为0,最后设置该元素的CSS规则为“display:none”。然后我们再来看个简单的代码:<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){$(".btn1").click(function(){$("p").hide();});$(".btn2").click(function(){$("p").show();});});</script></head><body><p>This is a paragraph.</p><button class="btn1">Hide</button><button class="btn2">Show</button></body></html>这个就是超简单的显示与隐藏了,如果要有效果我们只要在hide或show中带时间或参数即可:代码如下:<script type="text/javascript">$(document).ready(function(){$(".btn1").click(function(){$("p").hide(1000);});$(".btn2").click(function(){$("p").show(1000);});});</script>
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JQuery