[英]How to make a click on a child element not be considered a click on it's parent in jQuery?
[英]How to make parent element to be the size of the child element?
我在div元素中有iframe:
<div id="toolbarArea" class="toolbarArea" data-Date="11/2016">
<img id="toolbarTitle" width="15px" height="15px" src="../stdicons/derem/threePoints.png">
<iframe id="frTools" style="width:94%%;height:90%%;top:0px; position: absolute;" name="tbFrame" src="/container/serol/chegsorc.aspx?LOCALE=en" frameBorder="0"></iframe>
</div>
.toolbarArea{
background-color:#ffffff;
width:450px;
position:relative;
z-index:100;
height:30px;
border: solid 1px #333;
-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
}
我在div上滾動,如何使父元素成為子元素的大小以防止sccroll出現。
從類工具toolbarArea
刪除width
和height
.toolbarArea {
background-color: #ffffff;
position: relative;
z-index: 100;
border: solid 1px #333;
-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
}
您可以使用以下方法防止滾動出現:
width: auto;
height: auto;
overflow: hidden;
您需要使用float: left/right
或display: inline/inline-block
使父對象的寬度與其內容相同
#toolbarArea { background-color: #aaa; position: relative; display: inline-block; border: solid 1px #333; -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.75); -moz-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.75); box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.75); } #toolbarTitle { width: 15px; height: 15px; position: absolute; left: 0; top: 0; z-index: 10; } #frTools { width:94%; height:90%; }
<div id="toolbarArea" class="toolbarArea" data-Date="11/2016"> <img id="toolbarTitle" src="../stdicons/derem/threePoints.png"> <iframe id="frTools" name="tbFrame" src="/container/serol/chegsorc.aspx?LOCALE=en"></iframe> </div>
請注意,您的iFrame css無效,因為94%%
必須是94%
,依此類推。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.