`
xiaojiit
  • 浏览: 134175 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

JQuery自动设置IFrame的宽和高

 
阅读更多

1、JavaScript代码如下:

 

function autoFrameSize(iframe) {
	var _width=$("#"+iframe).contents().find("body")[0].scrollWidth;
	var _height=$("#"+iframe).contents().find("body")[0].offsetHeight;
	$("#"+iframe).height(_height);
	$("#"+iframe).width(_width);
}

 

2、Iframe的调用如下:

 

<iframe onload="autoFrameSize('mainFrame');" name="mainFrame" id="mainFrame" width="990" frameborder="no" border="0" src="${ctx }/welcome" scrolling="no"></iframe>

 

 

 

分享到:
评论

相关推荐

    iframe自适应宽高

    这个库允许的高度与同跨域iframe来适应他们所包含的内容的宽度自动调整大小。它最常见的问题与使用iframes提供一系列的功能,其中包括: 高度和宽度大小的iframe内容大小。 作品以多个嵌套的iframe。 跨域iframe域...

    iframe 自适应高度

    其中,`src`属性指定要加载的URL,`width`和`height`属性分别设置`iframe`的宽度和高度。但在实际应用中,我们往往希望`iframe`能根据加载的内容自动调整高度,以避免滚动条的出现。 以下是一些实现`iframe`自适应...

    iframe自适应高度

    在静态内容的情况下,我们可以直接设置固定的宽高。但在内容动态加载或跨域的情况下,这就变得复杂了。 为了解决`iframe`自适应高度的问题,我们可以采用以下几种策略: 1. **JavaScript/jQuery 解决方案**:这是...

    jQuery colorbox

    这里设置了弹出框的宽高、是否以Iframe方式打开,并自定义了链接的参数。 ### 示例应用 - 图片集:通过设置`rel`属性分组,可以创建一个图片集,用户可以使用箭头导航。 - 视频:将`iframe`设为`true`,并指定...

    jQuery弹层插件jquery.fancybox.js用法实例

    另外,弹出内容时,最好指定宽高,否则如果使用CSS特殊字体,即使设置了width和height,由于浏览器计算方式不同,弹层大小可能会有差异。 JavaScript调用方式如下: ```javascript $("#fancybox").fancybox({ '...

    layer iframe 设置关闭按钮的方法

    7. `area` 定义了弹窗的宽高,这里是 `800px` 宽和 `600px` 高。 8. `content` 指定弹窗要加载的 iframe 地址,这里是一个 HTML 文件。 9. `btn` 数组定义了弹窗底部的按钮,`['关闭']` 就是我们的关闭按钮。 10. 在...

    jQuery全屏响应浏览器轮播图代码

    例如,设置元素的宽高、透明度等属性,以及通过`&lt;iframe&gt;`或者Flash来支持旧版浏览器的视频播放。 3. **自动切换**:轮播图的自动切换功能通常通过计时器(如`setInterval`)实现,每隔一定时间(如3秒)切换到下...

    不错的JS弹出对话框插件 artDialog

    5. **API与事件**:提供了丰富的API接口和事件,方便开发者进行高级定制,例如设置对话框的宽高、位置、关闭按钮、按钮点击事件等。 **三、使用方法** 1. **引入文件**:首先需要将`artDialog.js`(或`jquery....

    如何前端实现在线预览pdf、word、xls、ppt等文件

    但是,开发者需要注意`&lt;iframe&gt;`的宽高设置,以及不同浏览器间的兼容性问题。 第四种方法是通过`&lt;embed&gt;`标签实现预览。`&lt;embed&gt;`标签是HTML5中的一部分,它支持PDF预览,并且可以设定文件预览的尺寸和类型。使用`...

    把文档转换成SWF文件

    这将创建一个800像素宽、600像素高的iframe,显示SWF文件内容。 4. **模拟百度文库效果**:为了达到类似百度文库的阅读体验,你可能需要进一步定制,例如添加翻页效果、搜索功能或者阅读控制条。这通常需要...

    前端项目-fitvids.zip

    其工作原理是通过监听容器的宽度变化,动态调整视频播放器的宽高比,使得视频始终填满其父容器的宽度,同时保持其原有的纵横比。这种方法尤其适用于那些需要在各种分辨率和屏幕尺寸下保持一致用户体验的项目。 在...

    视频响应式FitVids.js文件及示例代码

    FitVids.js的核心原理是通过CSS和JavaScript来修改内联样式,使视频容器适应其父元素的宽度,同时保持其宽高比。这个库主要支持主流的在线视频平台,如YouTube、Vimeo等,以及HTML5的`&lt;video&gt;`标签。 以下是FitVids...

    前端开发面试题

    - 利用 `border` 属性创建一个宽高为0的元素,并设置不同方向的边框颜色和宽度来绘制三角形。 #### JS代码调试技巧 - **Firebug**:Firefox的一个插件,功能强大。 - **IE开发人员工具**:Internet Explorer内置的...

Global site tag (gtag.js) - Google Analytics