隐藏可见性的元素会导致空白区域

Question

我正面对这样一个案例，使用“visibility：hidden”隐藏的弹出窗口仍然在屏幕中保留一个空格，而我无法控制该元素的坐标，因为它是由Primefaces控件自动计算的

JSFiddle example

这是我案例的模拟

<div class="main"></div>
<div class="dialog"></div>
<style>
    .main{
        background-color: red;
        width: 100%;
        height: 100%;
    }
    .dialog{
        position: absolute;
        top: 800px;
        left: 0px;
        width: 200px;
        height: 200px;
        visibility: hidden; 
    }
</style>

希望你能提供帮助，谢谢

Answer 1

使用jquery从屏幕中删除特定元素

$( ".dialog" ).remove();