如何通过将可见性属性设置为隐藏来滑动div？

Question

我有这样的元素：

<div id="propertiesArea"><div id="closeProperties"></div>some content</div> 

我需要使用JQuery通过设置CSS的可见性属性的slideToggle它隐藏起来。 这里我尝试：

$('#closeProperties').click(function(){  
     $('#propertiesArea').toggle('slide');   
    }); 

但它不工作。任何想法如何通过设置可见性属性将元素滑动到隐藏？

Answer 1

您是否尝试过使用隐藏方法来管理div的知名度？（）

$('#propertiesArea').hide(); 

Answer 2

我认为福斯特你需要crrect你的HTML

<div id="propertiesArea"> 
<div id="closeProperties"> 
    <div>some content</div> 
</div> 
</div> 

实际切换代码如下

$("#closeProperties").click(function() { 
    $("#propertiesArea").toggle("slow", function() { 
    // Animation complete. 
    }); 
}); 

按你上面的逻辑，您将无法再为你是隐藏日显示DIV e母公司。

Answer 3

这里的解决方案，请检查您的HTML代码：

<div id="propertiesArea"><div id="closeProperties">some content</div></div> 

和JS

$('#closeProperties').click(function(){  
    $('#propertiesArea').css('visibility', 'hidden');  
}); 

Answer 4

这是切换最简单的代码。

$('#closeProperties').click(function(){  
    $('#propertiesArea').toggle(":visible");  
}); 

或者

有jQuery中提供多一个功能叫做slideToggle

$('#closeProperties').click(function(){  
    $('#propertiesArea').slideToggle("slow"); // you can pass milliseconds or "fast"/"slow" keywords  
}); 

不同的是toggle只是隐藏和显示元件和slideToggle也隐藏和显示元素，但与滑动运动。