美文网首页
object元素覆盖div的处理

object元素覆盖div的处理

作者: LongfeiSong | 来源:发表于2017-03-02 15:50 被阅读0次

    解决div和object元素重叠时div被object覆盖的问题:
    在div内插入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="关闭视频" 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="参数设置" 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">设备</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;">更改设备/分辨率后需重新打开视频</span>
    </div>
    </div>

    相关文章

      网友评论

          本文标题:object元素覆盖div的处理

          本文链接:https://www.haomeiwen.com/subject/szqkgttx.html