精华内容
下载资源
问答
  • iframe使用 自适应高度 封装js
  • iframe框架使用

    万次阅读 2019-05-14 15:21:15
    --引入框架--> <iframe src="iframe.html" width="100%" height="100%" scrolling="no" marginheight="0" marginwidth="0"></iframe> <!-- 悬浮窗--> 我是充值悬浮窗 ...

    在开发过程中会遇到需要引入其他页面,并在其他页面上层悬浮div

    demo下载
    在这里插入图片描述

    index.html

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<title></title>
    	</head>
    	<style>
    		#box {
    			height: 100%;
    			width: 100%;
    			max-width: 640px;
    			background-color: aqua;
    			position: fixed;
    			left: 50%;
    			right: 50%;
    			margin-left: -320px;
    			margin-right: -320px;
    		}
    
    
    		#paybox {
    			background-color: aliceblue;
    			width: 100%;
    			height: 300px;
    			max-width: 320px;
    			position: fixed;
    			left: 50%;
    			right: 50%;
    			margin-left: -160px;
    			margin-right: -160px;
    			margin-top: -160px;
    			top: 50%;
    		}
    
    		#floatW {
    
    			text-align: center;
    			top: 50%;
    			display: block;
    			position:relative;
    			transform: rotateY(-50%);
    		}
    	</style>
    	<body>
    
    		<!--引入框架-->
    
    		<div id="box">
    			<iframe src="iframe.html" width="100%" height="100%" scrolling="no" marginheight="0" marginwidth="0"></iframe>
    		</div>
    
    
    
    		<!-- 悬浮窗-->
    
    		<div id="paybox">
    
    			<span id="floatW">
    				我是充值悬浮窗
    			</span>
    		</div>
    
    	</body>
    </html>
    
    

    iframe.html

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title></title>
    	</head>
    	
    	<style>
    		#gamebox{
    			width:100%;
    			height:100%;
    			position: absolute;
    			background: burlywood;
    		}
    		
    		
    	</style>
    	<body>
    		<div id="gamebox">
    		
    		</div>
    	</body>
    </html>
    
    
    展开全文
  • 使用iframeset的时候遇到了一些问题 ...2.iframe之间方法的调用 leftiframe方法 function lefMethod() {  .... } rightiframe中的方法 function rightMethod()  {  top.document.g

    使用iframeset的时候遇到了一些问题

    1.iframeset不能嵌套在body标签中,否则无法正常使用

    2.iframe之间方法的调用

    leftiframe方法

    function lefMethod()

    {

         ....

    }

    rightiframe中的方法

    function rightMethod()
     {
              top.document.getElementById("leftiframe").contentWindow.lefMethod();//调用左框架的方法

             top.window.mainmethod();//调用最外层框架即父框架的方法

      }

    展开全文
  • iframe框架内有一个button按扭,已设置了其click事件,想问下如何在激发此事件时实现跳转到iframe框架外的一个页面。
  • 而我设置input内容是要放到iframe的onload事件里,我本地调试没有问题,放到服务器就出现input框内容获取不到,后来找来找去,找到原因是iframe刚开始加载的时候才会调用onload事件,原因找到了然后就是解决方法。...

    我在做项目的时候,遇到一个情景当时是替换iframe,设置里面input内容。而我设置input内容是要放到iframe的onload事件里,我本地调试没有问题,放到服务器就出现input框内容获取不到,后来找来找去,找到原因是iframe刚开始加载的时候才会调用onload事件,原因找到了然后就是解决方法。我是这样解决的,首先创建div,div里面包括iframe。

    在通过jquery的方法load事件取代onload事件,我的.net代码如下(仅供参考): 

    var tabcv = document.getElementById("left-box");
                    var div = document.createElement("div");
                    div.innerHTML = href2;
                    div.style.width = "100%";
                    div.style.height = "100%";
                    var href2 = "<iframe width='100%' height='100%' id = 'myFrame'   src= \"" + pathAnswerArry[clickCount - 1] + "\"></iframe>";
                    div.innerHTML = href2;
                    tabcv.innerHTML = "";
                    tabcv.appendChild(div);
                    $("#myFrame").on('load', function () {

                        var inputs = $(document.getElementById("myFrame").contentDocument.getElementsByClassName("ipt"));
              
                        for (var i = 0; i < inputs.length; i++) {
                            var input = $(document.getElementById("myFrame").contentDocument.getElementsByClassName("ipt")[i]);
                            if (tmpAns[i] == undefined) {
                                input.val("");
                            } else {
                                input.val(tmpAns[i]);
                            }

                            input.css("background", "rgba(0, 0, 0, 0)");
                            input.attr({ "disabled": "disabled" });

    })

    注意使用jquery的方法时要使用比较高版本的jquery 的js

    展开全文
  • iframe框架

    2016-04-28 19:52:39
    经常和网站打交道或者经常建站的朋友对iframe肯定不陌生,网站有了iframe会变得更加美观、大气。对于初涉互联网的新手来说,iframe并不熟悉,...iframe标签是框架的一种形式,也比较常用到,iframe一般用来包含别的页

    经常和网站打交道或者经常建站的朋友对iframe肯定不陌生,网站有了iframe会变得更加美观、大气。对于初涉互联网的新手来说,iframe并不熟悉,那么iframe到底是什么?iframe用法有哪些呢?
    iframe用法:
    iframe是什么?
    iframe就是我们常用的iframe标签:<iframe>。iframe标签是框架的一种形式,也比较常用到,iframe一般用来包含别的页面,例如我们可以在我们自己的网站页面加载别人网站或者本站其他页面的内容。iframe标签的最大作用就是让页面变得美观。iframe标签的用法有很多,主要区别在于对iframe标签定义的形式不同,例如定义iframe的长宽高。
    iframe用法详解
    首先需要了解iframe标签的写法,和大多HTML标签写法相同,iframe标签输入形式为:<iframe></iframe>。以<iframe>开头,以</iframe>结尾,将需要的文本内容添加到两个标签之间即可。iframe标签内的内容可以做为浏览器不支持iframe标签时显示。
    iframe标签的属性
    align:left、right、top、middle、bottom。用于规定如何根据周围的元素来对齐此框架。不赞成使用。请使用样式代替。
    frameborder:1、0。用于规定是否显示框架周围的边框。
    height:pixels、%。用于规定iframe的高度。
    longdesc:URL。规定一个页面,该页面包含了有关iframe的较长描述。
    marginheight:pixels。定义iframe的顶部和底部的边距。
    marginwidth:pixels。定义iframe的左侧和右侧的边距。
    name:frame_name。规定iframe的名称。
    scrolling:yes、no、auto。规定是否在iframe中显示滚动条。
    src:URL。规定在iframe中显示的文档的URL。
    width:pixels。%。定义iframe的宽度。
    iframe用法案例
    例子1。

    <iframe width=420 height=330 frameborder=0 scrolling=auto src=URL></iframe>

     width插入页的宽;height插入页的高;scrolling 是否显示页面滚动条(可选的参数为 auto、yes、no,如果省略这个参数,则默认为auto);frameborder 边框大小;
     注意:URL建议用绝对路径

    <iframe width=0 height=0 frameborder=0 scrolling=auto src=www.zzidc.com></iframe>

     例子2。
     如果一个页面里面有框架。。随便点页面里的连接,要求在这个<iframe> 里打开。在iframe 中加入name=* (*自己设定)

    <iframe name=**  ></iframe>

     然后在修改默认打开模式,:网页HEAD中加上<a href=URL target=**>或部分连接的目标框架设为(**)
     例子3。
     要插入一个页面。要求只拿中间一部分。其他的都不要。,。。
     代码:

    <iframe name=123  align=middle marginwidth=0 marginheight=0 vspace=-170 hspace=0 src="http://host.zzidc.com/"  frameborder=no scrolling=no  width=776  height=2500></iframe>

     控制插入页被框架覆盖的深度 marginwidth=0 marginheight=0;控制框架覆盖上部分的深度 vspace=-170
     scrolling滚动条要否(auto、yes、no) frameborder框架的边框大小,width=776 height=2500此框架的大小。
     一、页面内加入iframe

    <iframe width=420 height=330 frameborder=0 scrolling=auto src=URL></iframe>

    scrolling表示是否显示页面滚动条,可选的参数为auto、yes、no,如果省略这个参数,则默认为auto。
     二、超链接指向这个嵌入的网页,只要给这个iframe命名就可以了。方法是<iframe name=**>,例如我命名为aa,写入这句HTML语言<iframe width=420 height=330 name=aa frameborder=0 src=http://host.zzidc.com></iframe>,然后,网页上的超链接语句应该写为:<a href=URL target=aa>
     三、如果把frameborder设为1,效果就像文本框一样
     透明的iframe的用法
     必需IE5.5以上版本才支持
     在transparentBody.htm文件的标签中,我已经加入了style=”background-color=transparent” 通过以下四种iframe的写法我想大概你对iframe背景透明效果的实现方法应该会有个清晰的了解:

    <iframe ID="Frame1" SRC="transparentBody.htm" allowTransparency="true"></iframe>
     <iframe ID="Frame2" SRC="transparentBody.htm" allowTransparency="true" STYLE="background-color: green"> </iframe>
     <iframe ID="Frame3" SRC="transparentBody.htm"></iframe>
     <iframe ID="Frame4" SRC="transparentBody.htm" STYLE="background-color: green"> </iframe>
    展开全文
  • Flex 嵌套 IFrame 框架

    2016-11-20 16:15:03
    Flex 嵌套 IFrame 框架
  • 最近在iframe框架使用wordexport插件时遇到了一个坑,在iframe外使用一切正常但是在iframe框架却不行,而且还不报错。找了一整天原因终于在从来不堪的警告里找到了这个: Download is disallowed. The frame ...
  • div中插入iframe框架,使连接跳转直接显示在iframe框架中 想要的效果类似与菜鸟教程的页面: https://www.runoob.com/html/html-attributes.html 现在开始上干货,首先创建两个div块,代码如图: 然后在第二个div块...
  • iframe框架讲解

    2017-05-12 16:45:49
    JS获取并操作iframe中元素的方法框架的应用   框架间的互相引用 一个页面中的所有框架以集合的形式作为window 对象的属性提供,例如:window.frames就表示该页面内所有框架的集合,这和表单对象、链接...
  • 使用bootstrap,iframe框架简单布局

    万次阅读 2018-04-14 19:14:46
    iframe框架布局,还有很多地方需要改进。很多内容还来不及写,后期慢慢补上。浏览器运行效果大概如下:index页面代码如下:[html] view plain copy&lt;!DOCTYPE html&gt; &lt;html lang="en&...
  • iframe内联框架使用

    2019-01-13 00:05:24
    &lt;iframe&gt; 标签规定一个内联框架。一个内联框架被用来在当前 HTML ...对于iframe应该谨慎使用,因为它具有效率低,浏览器的后退按钮无效,安全性等问题。 你可以把提示的文字放到 &lt;iframe&...
  • iframe框架运用

    2015-01-21 10:42:03
    iframe框架运用 框架可以嵌入到HTML页面中,作为HTML元素存在,其编码格式如下: 案例代码如下: iframe框架运用 案例介绍一 案例介绍二 案例介绍三 本网站版权...
  •  在做项目的过程中,需要完成修改密码后重新登录的功能,但是前端页面使用IFrame框架,修改页面内嵌在的index.html中, 重新登录的页面就内嵌到原来的页面中。 问题如图所示:   修改密码成功后:   ...
  • 各位是不是感觉标题很难看明白啊,其实这个标题通俗的讲就是iframe框架自适应框架内页面的高度,防止出现动态增加页面内容后,部分页面内容显示不出来的问题。 大概的思路就是,通过获取框架内页面的window对象(即...
  • iframe框架用法

    千次阅读 2015-08-03 17:43:19
    1.iframe标签:属性 值 描述 align left right top middle bottom 不赞成使用。请使用样式代替。规定如何根据周围的元素来对齐此框架。frameborder 1 0 规定是否显示框架周围的边框。 height pixels % ...
  • JSP页面中使用iframe框架

    千次阅读 2015-05-14 17:19:49
    1.javascript代码  function iframeURI()  {  document.getElementById("frameId").src = "ModifyPage.jsp";  }     function iFrameHeight() //iframe框架高度自适应  {  
  • 使用iframe框架后,当你想一整个页面跳转,却发现跳转后目标页面只变为iframe的子页面的解决方法
  • iframe 框架技术

    千次阅读 2015-09-19 10:50:51
    iframe元素会创建包含另外一个文档的内联框架,即行内框架。 作用就是将其他的网页嵌入到自己的页面汇中。 2、理解: 1.首先iframe是一个过时的技术,它是一个独立的作用域, 2.会阻塞主页面的onload事件 3...
  • bro.switch_to_default_content()#这是加进去的代码,如果不加入这一句的话,没办法正常切换到内嵌框架 e=bro.find_element_by_id("loginIframe") bro.switch_to_frame(e) sleep(5) bro.find_element_by_id("switcher...
  • iframe使用方法

    千次阅读 2016-05-19 10:55:33
    1、用jquery的ajax方法: $("#id").load(url,function(data,status){}); 这个方法的一个缺点是,当前页面的css会影响到这个嵌套的页面。 2、用iframe来嵌套: var iframe=document.createElement("iframe...
  • 切换窗口页签。 0是左边第一个,-1是右边第一个。 切换iframe框架。 查看页签是否包含iframe页签。 原理:如果没有找到id为mainiframe的iframe页签就会抛出异常。
  • iframe框架开发的网站中,如果在...跳出iframe框架 呢? 解决session过期跳转到登陆页面并跳出iframe框架 在你想控制跳转的页面,比如login.jsp中的与之间加入以下代码: Js代码 "JavaSc
  • 在一个叫top.html的页面定义两个iframe和两个方法 function top() { alert("top"); } //调用子框架gg.html页面中的gg函数,并把“我在top里呼唤gg”传给gg() function top_gg(){ window.frames["gg...
  • 跳出iframe框架

    2018-02-08 16:58:11
    跳出iframe框架,跳转到新的页面我做的是web项目,用下面语句代替request和response来实现跳转:String str="&lt;script&gt;window.open('这里写要跳转的地址','_top');&lt;/script&gt;"...
  • iframe框架及优缺点

    千次阅读 2020-03-19 11:15:27
    iframe框架及优缺点 HTML5不再支持使用frame,关于frame与iframe的区别,可以参阅 iframe与frame的区别 基本使用 src:规定在iframe中显示的文档的URL。 frameborder:规定是否显示框架周围的边框。 scrolling:...
  • 今天发现自己的网站被一个使用iframe框架作为搜索引擎的网站调用,自己的域名被加密get附在它的网址后面,网上很多都是js屏蔽,今天找到了最全最完美的解决方案,你如果也遇到了这种情况,不妨参考一下。 1、Meta...
  • iframe框架中打开页面的方法

    千次阅读 2015-12-31 10:42:15
    iframe打开窗口     在左框中打开链接  在右框中打开链接  技巧:在用脚本中设置目标框架的location属性值也可以达到同样的目的。如:  onClick="document.frames[’right’].location=this.href...
  • jsp的iframe框架应用

    千次阅读 2017-12-11 15:32:07
    代码如下: String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> "> ... iframe框架

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 55,328
精华内容 22,131
关键字:

iframe框架使用方法