且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

隐藏div但保留空白空间

更新时间:2023-12-03 18:37:52

使用可见性 css属性

可见性:


可见性属性指定是否渲染由
元素生成的框。




  $(。description)。css('visibility','hidden'); 

演示:小提琴


I have the following div

CSS

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

HTML

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

Then I have a click function on an element to hide the above div:

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

When I hide the div it will collapse (stop taking any space). This is messing with the layout of my page.

Is there a way I can hide the div but still take the space that it was taking before? I dont want to change the font color because it would be still selectable.

Thanks

Use visibility css property for this

visibility:

The visibility property specifies whether the boxes generated by an element are rendered.

$(".description").css('visibility', 'hidden');

Demo: Fiddle