jQuery隐藏/显示div

这是我的HTML结构

<div id="head"></div>
<div id="content"></div>
<div id="footer"></div>

现在，当我使用$content.hide隐藏content div时，我的页脚块出现了。我希望我的页脚块应该保持在底部固定，即使我隐藏或显示它

如何操作？

显示：无和可见性：隐藏是不同的

如果选择display:none，DIV将不再占用空间，因此页脚将出现

因此，您应该按照@putvande在评论中所说的使用：

$('#content').css('visibility','hidden')

如果设置visibility:hidden，DIV将隐藏为不可见，但它仍会占用空间，因为默认情况下其显示CSS仍然是display:block

要再次显示内容，请设置：

$('#content').css('visibility','visible')

此外，页脚通常使用position:fixed和bottom:0将其固定到页面底部，这可能会避免您现在遇到的问题。

使用以下选项，而不是隐藏：

css('visibility','hidden')

hide将显示样式设置为“无”，这将从文档流中完全删除该元素，并使其不占用空间

可见性：隐藏使空间保持原样

及

您可以通过JavaScript事件操作来显示

<div id="clickme">
  Click here
</div>
<div id="content">
  here is the content div
</div>
<script>
$( "#clickme" ).click(function() {
  $( "#content" ).show( "slow", function() {
    // Animation complete.
  });
});

---

在上面的场景中，您应该为页脚编写css，如下所示

#footer{
  position:absolute;
  top:150px;    
}

您可以根据需要更改顶部属性值

请参考以下JSFIDLE链接

试试这个-

head {position: fixed;top: 0}
footer {position: fixed;bottom: 0}

你可以用这个sytax $idContent.toggle； 或 您不能在调用函数后写入事件单击并使用它 $idContent.hide；

---

$idContent.show；只需设置它的位置：固定；底部：0；$'content'.css'visibility'，'hidden'您也应该向您显示JS。另外，display:none和visibility:hidden是不同的。我认为不应该提供任何额外的信息来理解这个问题better@putvande-那么如何将可见性设置为再次显示？在回答中添加，只需使用visible valueHello即可。我在div内容中有高分图表。因此，当我给出$'content'.css'visibility'，'visibility'命令时，它删除了Chrome和Safari中的div，但在Firefox中保留了一些Highcharts的痕迹。在Chrome和Firefox上可以看到这一点。