当 button
时,我正在尝试这样做按下后,会显示 div
在页面的中间无论我的页面在哪里,它可以在页面的底部或顶部,但仍然会在中间。
我正在使用position: absolute
因为我需要它“ float ”在其他元素之上。
我到处找了,没找到怎么做。仅在中间,但不是“动态”。
另外,我怎样才能制作 div
后面的页面的其余部分?已禁用?
我当前的CSS:
#buyComponentTesting{
background-color: blue;
z-index: 99;
width: 200px;
height: 200px;
position: absolute;
top: 26%;
left: 40%;
}
最佳答案
正如已经建议的,它应该是 position:fixed
而不是 position:absolute
。请避免为演示编写其他 CSS。
.page{
pointer-events:none;//page disabled
/*Not required for this solution*/
width:100%;
height:100%;
/*Not required for this solution*/
}
#buyComponentTesting{
position:fixed;
width:100px;
height:100px;
top:calc(50% - 50px);
left:calc(50% - 50px);
pointer-events:all; /*but the div is accessible*/
/*Not required for this solution*/
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid transparent;
background:beige;
cursor:pointer;
/*Not required for this solution*/
}
#buyComponentTesting:hover{
border-color:#333;
}
<div class="page">
<div id="buyComponentTesting">The DIV</div>
</div>
关于javascript - 如何将 div 动态居中到我的页面所在位置,并在 div 显示时使页面为 'disabled'?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61529088/