微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css – 覆盖iframe上的div

我正在创建一个类似于uservoice小部件的小部件,除了我希望页面内容在iFrame中,而不是通过 javascript显示小部件.
我怎么能有一个完整的页面(宽度/高度100%)iFrame与固定在浏览器左侧的div,一个例子(使用javascript而不是css / html)在这里http://uservoice.com/demo

我希望该小部件在页面上本地显示,并通过iFrame加载内容.

有任何想法吗?我不能让iFrame填满整个页面,并且也显示在顶部.我玩过Z-index而没有运气.代码示例:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 

            <style>
            #widget {
                left: 0px;
                position: absolute;
                top: 50%;
                display: block;
                z-index:100001;
                width: 25px;
                }
            #content {
                z-index:1;
                }
            </style>
</head> 
<body> 
    <div id="widget"> 
    widget
    </div>


    <iframe frameborder="0" id="content" src="http://www.google.com/" width="100%" height="100%"></iframe> 
</body> 
</html>

解决方法

如果您没有加载跨域,那么您可以使用jquery ajax调用加载
http://docs.jquery.com/Ajax/load
$(document).ready(function () {
    $("#content").load("page.html");
});

并用.替换你的iframe

<div id="content"></div>

原文地址:https://www.jb51.cc/css/215330.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。