2010-02-03 64 views
0

我是JQuery新手,我有一点OCD问题。JQuery - SlideToggle在同一时间多个DIV?

我正在使用SlideToggle单击功能来隐藏/显示一个容器div。然而它里面的div不会随着它滑动,它就会出现。

有没有一种方法可以让两个DIV一起滑入?

JQUERY:

<script type="text/javascript"> 
$(document).ready(function(){ 
$("#store_container").hide(); 
    $('#toggle').click(function(){ 
    $('#store_container').slideToggle("slow"); 
    return false; 
    }); 
}); 
</script> 

HTML:

<div id="store_container" style="display:none;"> 
    <div id="store_data"> 
     <p>THIS IS A TEST</p> 
     </div> 
</div> 
+0

这对我的作品(WebKit中)。你正在使用哪种浏览器?这是你使用的确切代码吗?有一些CSS吗? – user113716 2010-02-03 00:47:21

回答

1

试试这个:

<script type="text/javascript"> 
$(function(){ 
    $("#store_container").hide(); 
    $('#toggle').toggle(function(){ 
    $('#store_container').slideDown("slow", function() { $('#store_data').fadeIn(); }); 
    }, function() { 
    $('#store_data').fadeOut("fast", function() { $('#store_container').slideUp("slow"); }); 
    }); 
}); 
</script> 
    <div id="store_container" style="display:none; height: 300px;"> 
     <div id="store_data" style="display:none;"> 
     <p>THIS IS A TEST</p> 
     </div> 
    </div> 
+0

这没有奏效,一旦#store_container滑出,#store_data基本消失。很奇怪。 – iamtheratio 2010-02-03 00:42:12

+0

从消失这实际上保持#store_data .. <脚本类型= “文本/ JavaScript的”> $(函数(){ $( '#store_container,#store_data')隐藏(); $('# ('#store_container,#store_data')。slideToggle(“slow”); return false; }); }); 但它仍然没有让两个DIVS一起滑落,只有一个.. – iamtheratio 2010-02-03 00:44:34

+0

@iamtheratio - 更新,虽然你的原始样本适用于我在FireFox ....试试我当前的答案。 – 2010-02-03 00:44:42