隐藏div但保留空白区域-Java 学习之路

我有以下div

CSS

.description {
    color: #b4afaf;
    font-size: 10px;
    font-weight: normal;
}

HTML

<div class="description">Some text here </div>

然后我在一个元素上有一个click函数来隐藏上面的div：

$('#target').click(function(){
  $(".description").hide();
});

当我隐藏div时它会崩溃（停止占用任何空间） . 这会弄乱我的页面布局 .

有没有办法可以隐藏div但仍然占用它之前的空间？我不想更改字体颜色，因为它仍然可以选择 .

谢谢

5 回答

1
为此使用visibility css属性

能见度：

visibility属性指定是否呈现元素生成的框 .
```
$(".description").css('visibility', 'hidden');
```
演示：Fiddle
回复于 2024-05-04T03:51:59+08:00
96
另一种选择是为了完整性 . 切换 opacity ：
```
$(".description").css('opacity', 0); // hide
$(".description").css('opacity', 1); // show
```
http://jsfiddle.net/KPqwt/

但是，使用 visibility 是首选此任务 .
回复于 2024-05-04T03:51:59+08:00
5
尝试：
```
$(".description").css("visibility", "hidden")
```
hide() 相当于： $(".description").css("display", "none");

哪个不保留元素占用的空间 .

Hidden 使元素不可见，但是仍然保留空间 .
回复于 2024-05-04T03:51:59+08:00
0

重要的是要注意dfsq使用Opacity：0的示例仍然允许选择，复制/粘贴等内容，尽管在选择时没有可见的文本突出显示 .

回复于 2024-05-04T03:51:59+08:00
7

你可以在它的外面包裹另一个div，并且可能告诉它占用一个特定的高度 . 这样你的内部div可以显示和隐藏和fadeOut等，而外部div将压低页面上的不动产 .

回复于 2024-05-04T03:51:59+08:00