[英]show hidden child div without changing the size of parent div
我有以下代碼：
function show() { document.getElementById("child").style.display = "block"; }
#parent { background-color: orange; padding: 2em; } #child { background-color: pink; padding: 3em; display: none; }
<div id="parent" onmouseover="show()"> <div id="child"> Child div </div> </div>
當我將鼠標懸停在父級div上時，父級的大小會更改。 有沒有辦法在不改變父div大小的情況下將子div顯示在父div之上？
您可以使用
visibility:hidden
代替
display:none
顯示/隱藏內容並保持大小不變。 需要相應地更改腳本。
您可以在父元素上使用相對位置，在子元素上使用絕對位置：
function show() { document.getElementById("child").style.display="block"; }
#parent { background-color: orange; padding:2em; position:relative; } #child { background-color: pink; padding: 3em; display: none; position: absolute; }
<html> <head> <title></title> </head> <body> <div id="parent" onmouseover="show()"> <div id="child"> Child div </div> </div> </body> </html>
這是您需要的嗎http://jsfiddle.net/u74m4x9o/
<div id="parent" onmouseover="show()">
<div id="child">
Child div
</div>
</div>
function show() {
document.getElementById("child").style.display = "block";
}
#parent {
background-color: orange;
padding: 2em;
}
#child {
background-color: pink;
padding: 1em;
display: none;
position:absolute;
top : 1em
}
如何在不影響周圍div的情況下按比例放大父div並在懸停時顯示隱藏的子div
[英]How to scale up parent div and show hidden child div on hover without affecting surrounding divs
如果子 DIV 的任何部分位於父 DIV 的區域之外且沒有溢出，則將其設為不透明：隱藏
[英]Make any part of a child DIV opaque if it is outside of the area of the parent DIV without overflow:hidden
如何在不更改該元素同級元素的位置的情況下顯示子div？
[英]How to show a child div without changing the position of that element's siblings?
如何使用JavaScript在父div內顯示子div而不觸發其他
[英]How can I show the child div inside the parent div using javascript without triggering the others
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.