object元素覆蓋div的處理

解決div和object元素重疊時(shí)div被object覆蓋的問題:
在div內(nèi)插入iframe元素,定位z-index=-1,透明度0,div定位z-index大于iframez-index即可。

<div id="div" style="display:none;width:300px;height:300px;background-color:#ccc;margin-bottom:10px;position:absolute;z-index:100;left:300px;top:100px;font-size:50px;color:#999;">這是在Object元素上層的div<div><button onclick="alert(new Date)">button</button></div><iframe id="iframe1" src="about:blank" frameBorder="0" marginHeight="0" marginWidth="0" style="position:absolute; visibility:inherit; top:0px;left:0px;width:100%; height:100%;z-index:-1; filter:alpha(opacity=0);"></iframe></div>
<div style="width:800px;margin:0 auto;">
<object id="view1" style="position:relative;z-index:0;" type="application/x-eloamplugin" width="400" height="300" name="view"></object>
<div style="display:inline-block;width:120px;padding-left:15px;">
<input class="submit_01 btn" type="button" value="打開視頻" onclick="OpenVideo()" /><br />
<input class="submit_01 btn" type="button" value="關(guān)閉視頻" onclick="CloseVideo()" /><br />
<button class="submit_01 btn" type="button" onclick="Scan()"><span style="letter-spacing:2em">拍</span>照</button><br />
<input class="submit_01 btn" type="button" value="上傳圖片" onclick="UploadThumbToServer()" /><br />
<input class="submit_01 btn" type="button" value="參數(shù)設(shè)置" onclick="ShowProperty()" /><br />
<div style="display:inline-block;padding-bottom:10px">
<input id="SetState" type="checkbox" value="" onclick="SetState(this)" /><label for="SetState" style="line-height:16px;">手動框選</label><br />
<input id="EnableDate" type="checkbox" value="" onclick="EnableDate(this)" /><label for="EnableDate" style="line-height:16px;">添加日期</label>
</div>
</div>
<object id="thumb1" type="application/x-eloamplugin" width="95%" height="130" name="thumb"></object>
<br />
<div class="btn-wrap" style="display:none">
<label id="lab1">設(shè)備</label>
<select id="device" class="sel" name="device" onchange="changeDev()"></select>
<select id="subType" class="sel" name="subType" onchange="changesubType()"></select>
<label>分辨率</label>
<select id="selRes" class="sel" name="selRes"></select>
<span style="color:#f00;font-size:14px;font-weight:bold;">更改設(shè)備/分辨率后需重新打開視頻</span>
</div>
</div>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,091評論 1 92
  • 一:在制作一個(gè)Web應(yīng)用或Web站點(diǎn)的過程中,你是如何考慮他的UI、安全性、高性能、SEO、可維護(hù)性以及技術(shù)因素的...
    Arno_z閱讀 1,354評論 0 1
  • 最近做個(gè)web項(xiàng)目,因?yàn)槔锩嬗袀€(gè)object的插件,彈出對話框會被其遮蓋,我做了個(gè)iframe標(biāo)簽,在彈框時(shí)...
    武鵬磊閱讀 2,131評論 1 2
  • 轉(zhuǎn)載請聲明 原文鏈接地址 關(guān)注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    前端進(jìn)階之旅閱讀 16,854評論 32 459
  • 一、邊框 1.border-radius2.box-shadow:X軸偏移量 Y軸偏移量 [陰影模糊半徑] [陰影...
    張延偉閱讀 314評論 0 1

友情鏈接更多精彩內(nèi)容