iframe 自适应浏览器高度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="js/jquery1.6.2.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<BODY style="overflow-y: hidden;margin:0px; padding:0px;">
<div id="sou" style="height:77px">
<ul>
<li style=" width:30px; margin-top:22px"><a href="#" class="page"><img src="img/but02.png" width="17" height="24" border="0"></a></li>
<li style=" width:30px; margin-top:22px"><img src="img/but03.png" width="17" height="24" /></li>
<li style=" width:45px"><img src="img/home.png" /></li>
<li style=" width:5px"><img src="img/sou_left.gif" /></li>
<li style="width:60%">
<input type="text" class="sou-li-input" value="请输入要抓取产品的网址" onfocus="if (value ==‘请输入要抓取产品的网址‘){value =‘‘}" onblur="if (value ==‘‘){value=‘请输入要抓取产品的网址‘}" />
</li>
<li style=" width:5px"><img src="img/sou_right.gif" /></li>
<li style=" width:50px; text-align:center"><img src="img/but04.png" width="38" height="38"/></li>
<li style=" width:134px"><img src="img/but05.png" /></li>
</ul>
</div>
<div id="goods_box_wrapper" style=" margin:auto; margin-top:1px">
<iframe id="goods_box" frameborder="0" width="100%" height="100%" border="0" src="http://www.alibaba.com" ></iframe>
</div>
<script type="text/javascript">
$(function () {
var flag = false;
$(‘#open‘).click(function () {
var $side = $(‘#fix_bar‘);
if (!flag) {
$side.animate({ ‘left‘: 0 });
flag = true;
} else {
$side.animate({ ‘left‘: -280 });
flag = false;
}
});
});
reheight();
$(window).resize(reheight);
function reheight() {
var height = $(window).height();
if ($.browser.msie) {
height = height - 100;
} else {
height = height - 120;
}
$("#goods_box").height(height);
}
</script>
</html>

js下载地址:http://files.cnblogs.com/files/robt/jquery1.6.2.js

时间: 2024-10-04 00:01:13

iframe 自适应浏览器高度的相关文章

jquery实现div自适应浏览器高度

<!DOCTYPE html><html><head><meta charset=UTF-8 /><title>jquery实现div自适应浏览器高度(宽度)</title><meta name="keywords" content="html5" /><meta name="description" content="html5 test&quo

jquery库实现iframe自适应内容高度和宽度

javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码! ‍<iframe src="index.php" id="mainiframe" name="mainiframe" width="100%"   frameborder="0" scrolling="no" marginwidth="0" margi

自适应浏览器高度和宽度+字体大小 JS(主要针对Java后端&gt;&gt;全栈工程师)

自适应浏览器高度和宽度+字体大小有点:1.能自动判断当前浏览器的高度和宽度(页面里面设置均百分比宽度)2.JS里面自己设置字体大小,在不同分辨率下显示不一样的字体3.在浏览器最大化时候,JS会自动判断屏幕高宽,从而使样式布局不会冲突变化4.在浏览器最小化时候,JS会自动判断屏幕高宽,从而使最小化的屏幕还和全屏效果一致,只是出现滚动条全屏效果图01最小化效果图02页面设计效果图自适应高宽JS效果图附上JS代码(引用前必须先引用Jquery!!!)// 作者:[email protected]//

iframe自适应内容高度

/***上传控件iframe自适应**/function iframeautoHeight(obj, frameObj) {    if (document.all) {        if (frameObj) {            obj.height = document.getElementById(frameObj).contentWindow.document.body.scrollHeight;            obj.width = document.getElemen

[转]iframe自适应宽度高度

<iframe id="iframe" onLoad="AutoFit();" frameborder="0" scrolling="no" src="http://www.cnblogs.com"> </iframe> JQuery代码: function AutoFit() { var ifm = document.getElementById("iframe"

iframe自适应宽度高度

html 1 <iframe src="index.html" id="iframepage" frameborder="0" scrolling="no" onLoad="iFrameHeight()"></iframe> script 1 <script> 2 function iFrameHeight() { 3 var ifm = document.getElem

怎样让一个div高度自适应浏览器高度

原文:http://www.jb51.net/web/79171.html 原文:http://zhidao.baidu.com/link?url=oId1sFRhiBnV37-RmRE6WQNHxiXvVBlS7wsxpOpKSsw6m6shfBGOArvYE4tTkWag_zeWaEkf7APkf0bZxMQUSlMvBKZNK5G4RIai1gKHc1S 这个老生长谈的问题,不知困扰了多少前端开发人员,和后端程序员,其实很简单,这里写出来,让大家分享下,有很多人说,我已经设置div 100

两段超简单jquery代码解决iframe自适应高度问题(不用判断浏览器高度)

这里介绍两个超级简单的方法,不用写什么判断浏览器高度.宽度啥的.下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的.注意别放错了地方.iframe的代码中,注意要写ID,没有ID查找不到<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling=

网页制作技巧:iframe自适应高度

转自:http://www.enet.com.cn/article/2012/0620/A20120620126237.shtml 通过Google搜索iframe 自适应高度,结果5W多条,搜索iframe 高度自适应,结果2W多条. 我翻了前面的几十条,刨去大量的转载,有那么三五篇是原创的.而这几篇原创里面,基本上只谈到如何自适应静的东西,就是没有考虑到JS操作DOM之后,如何做动态同步的问题.另外,在兼容性方面,也研究的不彻底. 这篇文章,希望在这两个方面再做一些深入. 可能有人还没接触到