超简单的跨域iframe高度自适应的页面
——从金山导航接入历史上的今天内容说起大家学习一下技术吧!我找了很久，这个算不错的了。
在实际的项目进行中，很多地方可能由于历史原因不得不去使用iframe，包括目前正火热的应用开发也是如此。
随之而来的就是在实际使用iframe中，会遇到iframe高度的问题，由于被嵌套的页面长度不固定而显示出来的滚动条，不仅影响美观，还会对用户操作带来不便。于是自动调整iframe的高度就成为本文的重点。
采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键，同时由于JavaScript对不同域名下权限的控制，引发出同域、跨域两种情况。
1.期待中发现
2014年12月，通过cnzz统计注意到几个特殊的来路(https://www.doczj.com/doc/4d18377042.html,/tiyan.html) tiyan体验版，个人判断是内部测试版本，过段时间就会上线的，那么我的“历史上的今天”又和上首页啦，11月刚上“中国搜索”首页！这可是又一次惊喜了！
10日，金山导航的BD郑皓月联系上了我，说：“我们二级页想接入你们历史上的今天的内容~ ”。
我问：具体我们要怎样和贵方换量呢？我们之前和 https://www.doczj.com/doc/4d18377042.html, 合作过这种形式
郑回：你和hao123当时的是按照什么比例换滴
我答：https://www.doczj.com/doc/4d18377042.html,/lishi/底部有个“历史上的今天”，当时是没有换的，是他们免费给我做的，但后来军事类top81打入，接hao123通知，没办法被换了。只留在顶部给我们保留个链接。
总结：专业不如商业——这是铁的事实
2.印证：天上掉下的林妹妹，没见了！
接下来，我们讨论如何换量，两个不对称的网站如何换量呢？
郑说：“每天有1w的流量，希望能你们也给我们一些位置，给我们导入流量，2:1的方式可以吗？（我们给你们1w 你们给我们5k ）”
我说：“这个量估计无法达到，原因是：有些用户是通过邮箱订阅（QQ邮箱5万订阅，139邮箱也近5万，网易云阅读5万多）以及网络媒体编辑的转载，实际来到我们网站的流量已经很少了。我们还采用以绿色公益等方式保持界面清晰来，这样网站广告位就更少”
最后，皓月跟产品经理沟通下这下情况，同意了不换量的合作，只在首页做个不能保证流量多少广告条展示品牌。而他们能够在二级目录通过 iframe直接调用到我们的内容。
皓月把我拉入QQ讨论群，用了几天时间相互协作完成了iframe页面，在此佩服一下金山的几名员工，下午直到晚上，中间没有休息吃饭的在QQ谈论群中聊工作。
原因很简单，duba已经把首页“历史上的今天”链接改为https://www.doczj.com/doc/4d18377042.html,/lssdjt.html了。又喜又悲，网站几何？
3.iframe高度自适应的页面
通过这次交流，感受到“金山精神”值得肯定，虽然不能获得更多的流量，但也是一次品牌宣传，让更多的用户了解我们，一个坚持了十年多的老站长，专注于“历史”与“今天”，“镜子”与“现实”的融合。同时技术也得到提升，如跨域iframe 高度自适应的页面问题，一开始，我们提供的页面是同域自适应高度，代码如下：
/*同域可以使用，但跨域就不能用了。*/
function IFrameResize() {
//alert(this.document.body.scrollHeight); //弹出当前页面的高度
var obj = parent.document.getElementById("duba_lssdjt_frame"); //取得父页面IFrame对象 //alert(obj.height); //弹出父页面中IFrame中设置的高度
if (obj) {
obj.style.height = document.getElementById("list").offsetHeight + "px"; //调整父页面中IFrame的高度为此页面的高度
//alert("调节高度："+document.getElementById("list").offsetHeight);
}
}
4.跨域iframe高度自适应的页面
iframe跨域高度自适应以前遇到过，但没有弄成功，这次可以向duba技术们请教如何开展了。首先 xx 发给我一个iframe 高度自适应的页面.rar因为遇到周六日，大家都放假，我只好下载来晚上慢慢研究，结果就是弄不明白，因为调试过程需要双方的配合，毕竟是“跨域”，所以“单独”就老是弄不好，加上技术这方面有点呆的我。
经过几天和金山导航的技术员耐心细语的交流，大概总结“跨域”高度自适应的方法如下：
一、A站要建立2个页面：https://www.doczj.com/doc/4d18377042.html,/lssdjt.html，lssdjt.html页面通过iframe调用B站数据源，代码如
下：
在建立第2个页面：https://www.doczj.com/doc/4d18377042.html,/lssdjt/iframe_lssdjt_height.html，代码如下：
二、B站要建立1个页面：https://www.doczj.com/doc/4d18377042.html,/duba.htm，duba.htm为数据源，高度自动变化，页面要引入jquery
并在其底部插入js代码，如下：
/*跨域高度自适应的页面*/
(function($){
$(function(){
var $_box = $('.wrap');
var mentHeight =
$_box.outerHeight()+parseInt($_box.css('marginTop'))+parseInt($_box.css('marginBottom'));
var frame = $(' src="https://www.doczj.com/doc/4d18377042.html,/lssdjt/iframe_lssdjt_height.html?lishijintian#'+mentHeight+'"/>').css ({ display: 'none' }); $('body').append(frame); setInterval(function(){ var bodyHeight = $_box.outerHeight()+parseInt($_box.css('marginTop'))+parseInt($_box.css('marginBottom')); if(bodyHeight == mentHeight){ return false; } mentHeight = bodyHeight; frame.remove(); frame = $(' src="https://www.doczj.com/doc/4d18377042.html,/lssdjt/iframe_lssdjt_height.html?lishijintian#'+mentHeight+'"/>').css ({ display: 'none' }); $('body').append(frame); },500); }); })(jQuery); 三、原理：A站页面lssdjt.html通过iframe调用B站duba.htm时，当页面duba.htm高度发生变化时，页面duba.htm通 过自身的代码向https://www.doczj.com/doc/4d18377042.html,/lssdjt/iframe_lssdjt_height.html这个页面发送高度参数，这时A站页面 iframe_lssdjt_height.html接收高度数值后，调整同域页面lssdjt.html的高度，这样就实现跨域高度自适应了。 总结，通过百度搜索：IFrame跨域高度自适应实现代码，能够查找很多，我有的测试过，也有只浏览而已，但总结都没有以上代码简单，思路清晰。希望大家能够借鉴，同时谢谢金山网址导航越办越好！——2014年12月 自适应滤波 第1章绪论 (1) 1．1自适应滤波理论发展过程 (1) 1．2自适应滤波发展前景 (2) 1．2．1小波变换与自适应滤波 (2) 1．2．2模糊神经网络与自适应滤波 (3) 第2章线性自适应滤波理论 (4) 2．1最小均方自适应滤波器 (4) 2．1．1最速下降算法 (4) 2．1．2最小均方算法 (6) 2．2递归最小二乘自适应滤波器 (7) 第3章仿真 (12) 3.1基于LMS算法的MATLAB仿真 (12) 3.2基于RLS算法的MATLAB仿真 (15) 组别：第二小组 组员：黄亚明李存龙杨振 第1章绪论 从连续的(或离散的)输入数据中滤除噪声和干扰以提取有用信息的过 程称为滤波。相应的装置称为滤波器。实际上，一个滤波器可以看成是 一个系统，这个系统的目的是为了从含有噪声的数据中提取人们感兴趣的、 或者希望得到的有用信号，即期望信号。滤波器可分为线性滤波器和非 线性滤波器两种。当滤波器的输出为输入的线性函数时，该滤波器称为线 性滤波器，当滤波器的输出为输入的非线性函数时，该滤波器就称为非线 性滤波器。 自适应滤波器是在不知道输入过程的统计特性时，或是输入过程的统计特性发生变化时，能够自动调整自己的参数，以满足某种最佳准则要求的滤波器。 1．1自适应滤波理论发展过程 自适应技术与最优化理论有着密切的系。自适应算法中的最速下降算法以及最小二乘算法最初都是用来解决有／无约束条件的极值优化问题的。 1942年维纳(Wiener)研究了基于最小均方误差(MMSE)准则的在可加性噪声中信号的最佳滤波问题。并利用Wiener．Hopf方程给出了对连续信号情况的最佳解。基于这～准则的最佳滤波器称为维纳滤波器。20世纪60年代初，卡尔曼(Kalman)突破和发展了经典滤波理论，在时间域上提出 了状态空间方法，提出了一套便于在计算机上实现的递推滤波算法，并且适用于非平稳过程的滤波和多变量系统的滤波，克服了维纳(Wiener)滤波理论的局限性，并获得了广泛的应用。这种基于MMSE准则的对于动态系统的离散形式递推算法即卡尔曼滤波算法。这两种算法都为自适应算法奠定了基础。 从频域上的谱分析方法到时域上的状态空间分析方法的变革，也标志 着现代控制理论的诞生。最优滤波理论是现代控制论的重要组成部分。在控制论的文献中，最优滤波理论也叫做Kalman滤波理论或者状态估计理论。 从应用观点来看，Kalman滤波的缺点和局限性是应用Kalman滤波时要求知道系统的数学模型和噪声统计这两种先验知识。然而在绝大多数实际应用问题中，它们是不知道的，或者是近似知道的，也或者是部分知道的。应用不精确或者错误的模型和噪声统计设计Kalman滤波器将使滤波器性能变坏，导致大的状态估计误差，甚至使滤波发散。为了解决这个矛盾，产生了自适应滤波。 最早的自适应滤波算法是最小JY(LMS)算法。它成为横向滤波器的一种简单而有效的算法。实际上，LMS算法是一种随机梯度算法，它在相对于抽头权值的误差信号平方幅度的梯度方向上迭代调整每个抽头权 值。1996年Hassibi等人证明了LMS算法在H。准则下为最佳，从而在理论上证明了LMS算法具有孥实性。自Widrow等人1976年提出LMs自适应滤波算法以来，经过30多年的迅速发展，已经使这一理论成果成功的应用到通信、系统辨识、信号处理和自适应控制等领域，为自适应滤波开辟了新的发展方向。在各种自适应滤波算法中，LMS算法因为其简单、计算量小、稳定性好和易于实现而得到了广泛应用。这种算法中，固定步长因子μ对算法的性能有决定性的影响。若μ较小时，算法收敛速度慢，并且为得到满意的结果需要很多的采样数据，但稳态失调误差 CSS表单设计 文章出处：https://www.doczj.com/doc/4d18377042.html, 今天我们开始学习《十天学会web标准(div+css)》的css表单设计，包含以下内容和知识点： 改变文本框和文本域样式 用图片美化按钮 改变下拉列表样式 用label标签提升用户体验 一、改变文本框和文本域样式 如果前边几章学习的比较扎实的话，本节教程就相当容易了。下边先说一下文本框，文本框和文本域都是可以用css进行美化的。比如改变边框精细，颜色，添加背景色、背景图像等。请看下边的实例： .text1 { border:1px solid #f60; color:#03C;} .text2 { border:2px solid #390; width:200px; height:24px; font-size:16px; font-weight:bold; line-height:1.6;} .text3 { border:2px solid #C3C; height:20px; background:url(icon9.gif) right 3px no-repeat;} .text4 { border:2px solid #F60; width:150px; height:29px;font-size:16px; line-height:1.6; background:url(bg_9.gif) 0 0 no-repeat;} 这四个样式表分别对应第2、3、4、5行表单，第一行是文本框的默认样式；第二行为设置边框和字体颜色的样式；第三行为设置边框、宽度、高度、字体大小、行高的样式；第四行设置边框和增加背景色和背景图片；第五行为增加一个gif动画的背景图片，看起来是不是生动许多，具体步骤不再赘述。下面我们看一下文本域的样式设置： .area { border:1px solid #F90; overflow:auto; background:#fff url(bg_9_1.gif) right bottom no-repeat; width:99%; height:100px;} 上图中第一个为默认的文本域样式，第二个为设置边框、宽度为百分比、高度和景图片。overflow:auto定义当内容不超过现在文本域高度时不出现滚动条。好了，下面运行一下代码看看两者的效果吧 目前常见的自适应算法研究与比较 常见自适应滤波算法有：递推最小二乘算法，最小均方误差算法，归一化均方误差算法，快速精确最小均方误差算法，子带滤波，频域的自适应滤波等等。 其中最典型最有代表性的两类自适应算法就是递推最小二乘算法和最小均方误差算法，以下对几种较常用的算法进行介绍： 1、递归最小二乘法(RLS) RLS 算法的基本方法为: ^^33()()(1) ()()() (1)()()()(1)() 1()[(1)()()(1)] ()(1)()() T T T d n X n H n e n d n d n P n X n k n X n P n X n P n P n K n X n P n H n H n K n e n λλ=-=--=+-=---=-+ K(n) 称为Kalman 增益向量,λ是一个加权因子,其取值范围0 <λ< 1 ,该算法的初始化一般令H( - 1) = 0及P( - 1) = 1/δI,其中δ是小的正数。 2、最小均方误差算法（LMS ） 最小均方误差算法（LMS ）是一种用瞬时值估计梯度矢量的方法，即 2[()]()2()()()n e n e n n n ??==-?X h （1） 按照自适应滤波器滤波系数矢量的变化与梯度矢量估计的方向之间的关系，可以写出LMS 算法调整滤波器系数的公式如下所示： 1(1)()[()]2n n n μ+=+-?h h ()()()n e n n μ=+h X （2） 上式中的μ为步长因子。μ值越大，算法收敛越快，但稳态误差也越大；μ值越小，算法收敛越慢，但稳态误差也越小。为保证算法稳态收敛，应使μ在以下范围取值： 212 0() N i x i μ=<<∑ 从收敛速度来看，RLS 算法明显优于LMS 算法,但RLS 算法在运算上却比LMS 算法复杂得多,为了减小计算复杂度,并保留RLS 的收敛性能,人们提出了 让iframe自适应大小解决方案 第一种： 例子： 1，创建页面test.html 。页面中含有一个iframe，name为ifrname ，id为ifrid，src 为iframe.html 页面。 2，创建iframe.html 页面，里面含有一些内容。 这是iframe页面，通过在父窗口页面或子页面添加JS来自动更改宽高，以适应内容的多少。 要想使iframe自动适应宽和高，可以在test.html 页面iframe onload处增加一些JS代码。如： 这样iframe即可以自动适应高度了。如果不在onload处增加js，那也可以放到页面上来调用。比如写个函数。 这样也可以达到自适应高宽的目的，在这里要注意的是，iframeElement参数必须是 document.getElementById("iframeid")，iframeWindow参数是window.frames[0] 或 document.frames["ifrname"]。这是因为通过name得到的对象是窗口(window)对象，非窗口里的iframe 对象。同时document.getElementById("iframeid)不能像window对象可以得到window.document。 所以这里最好给iframe分别加上name和id，id用来更改宽高样式属性，name用来执行window相关事件如location.href，document.write。bgColor例外，元素对象和窗口对象都可以得到，这是因为他们都有这个属性。 维纳自适应滤波器设计及Matlab实现 摘要 本文从随机噪声的特性出发，分析了传统滤波和自适应滤波基本工作原理和性能，以及滤波技术的现状和发展前景。然后系统阐述了基本维纳滤波原理和自适应滤波器的基本结构模型，接着在此基础上结合最陡下降法引出LMS算法。在MSE准则下，设计了一个定长的自适应最小均方横向滤波器，并通过MATLAB 编程实现。接着用图像复原来验证该滤波器的性能，结果表明图像的质量在MSE 准则下得到了明显的改善。最后分析比较了自适应LMS滤波和频域维纳递归滤波之间的性能。本文还对MATLAB里面的自适应维纳滤波函数wiener2进行了简单分析。 关键字：退化图像维纳滤波自适应滤波最陡下降法LMS Abstract This paper analyses the basic work theory, performance of traditional filter and adaptive filter based on the property of random noise, and introduce the status quo and the foreground of filter technology. Then we explain basic theory of wiener filter and basic structure model of adaptive filter, and combine the method of steepest descent to deduce the LMS. Afterward according to the MSE rule, we design a limited length transversal filter, and implement by MATLAB. And then we validate performance of adaptive LMS filter by restoring images, Test result show that the quality of the degrade images were improved under the rule of MSE. Finally, we compare the performance of adaptive LMS filter and iterative wiener filter. We also simply analyses the wiener2 () which is a adaptive filter in MATLAB. Keywords: degrade image；wiener filter；adaptive filter；ADF；LMS algorithm fancyBox 中文文档 fancyBox 为您的网页提供惊艳的缩放功能，同时支持图片、网页内容以及各种多媒体文件。 她基于目前最流行的jQuery 框架开发，不仅易于应用，而且可以定制。欢迎来到fancyBox 的世界~ ?更新日志 ?快速入门 ?常见用法 ?官方演示 ?使用许可&下载地址 ?完整API ?常见问题 更新日志 重大变更 ?可扩展的幻灯片导航工具 ?响应式（调整浏览器窗口大小时自适应窗口大小） ?集成幻灯片图片播放功能 ?新增幻灯片过渡效果 ?引入CSS3阴影、圆角特效 ?新的插件选项（与之前版本不兼容） ?改用知识共享署名-非商业性使用3.0许可协议授权 即将上线 ?WordPress小插件 ?重构本站及API文档 ?完善缩略图浏览工具 ?fancyBox 手机版（待定） ?fancyBox 3.0 ↑回顶部 快速入门 1. 下载fancyBox，解压后根据需要将文件复制到网页文件夹中（建议不要更 改目录结构），并在网页源码中引入相应的css 样式和js 文件（如果更改了目录结构，引入的时候请调整相应代码，对应它们所在的路径）。 注意：别忘了还要先加载jQuery 库！推荐使用公共库：百度 | 新浪。示例代码： < !-- 引入 mousewheel 插件（可选，如果想通过鼠标滚轮控制图片播放则必须） --> 2. 给触发fancyBox 特效的元素（如一张缩略图或“点击我”三个字）加上a 链接，并将其href 属性值设置为遮罩层中需要展示的文件的链接（如刚刚那张缩略图的原图的网址）。示例代码： iframe的详细用法 IFRAME 元素| iframe 对象 -------------------------------------------------------------------------------- 创建内嵌浮动框架。 成员表 下面的表格列出了iframe 对象引出的成员。请单击左侧的标签来选择你想要查看的成员类型。 标签属性/属性 SHOW: 标签属性/属性 行为 集合 事件 滤镜 方法 对象 样式 标签属性属性描述 ALIGN align 设置或获取表格排列。 ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA)，以便免除浏览器安全模式。 ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。 BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。 BORDER border 设置或获取框架间的空间，包括3D 边框。 canHaveChildren 获取表明对象是否可以包含子对象的值。 canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。 CLASS className 设置或获取对象的类。 contentWindow 获取指定的frame 或iframe 的window 对象。 DATAFLD dataFld 设置或获取由dataSrc 属性指定的绑定到指定对象的给定数据源的字段。 DATASRC dataSrc 设置或获取用于数据绑定的数据源。 disabled 获取表明用户是否可与该对象交互的值。 END end 设置或获取表明元素结束时间的值，或者元素设置为重复的简单持续终止时间。firstChild 获取对象的childNodes 集合的第一个子对象的引用。 竭诚为您提供优质文档/双击可除 html5,布局,模板 篇一：干货!全新的免费html5网页模版 干货！全新的免费html5网页模版 目前互联网上存在很多专业的高质量html5模版，并且是免费的，如果你熟悉编程的话，只需要研究一下它们的代码就可以学到很多便捷的操作和新的技术。在今天的文章当中我不是列出一长串可用模版的列表，而是精挑细选出高质量的响应式html5模版。更重要的是，它们都是免费的，所以我希望能有几个模版能满足的你的需求，能够运用于你的项目当中。 codester legend legend是一个基于twitterbootstrap的多功能响应式 单页模版。你可以用它来制作一个登录页，或者说是创意设计人员的线上作品展示网站，甚至于是构建一个商务主题站。 caprice liquidgem liquidgem利用css媒体查询和百分比布局给出了一个 完整的响应式设计。它还包括一个图片幻灯，一套完整的php 联系表单和一个工作示例页面。 mnml 一个轻量级的模版，用于html5/scss的响应式项目。 Varna 免费，开源，极简的响应式网站模版。 agency agency是基于twitterbootstrap建立的响应式html5商务模版。 century 拥有工作分类和音乐播放器的响应式html5模版。 mori-dark 极其简约的响应式博客模板。 篇二：html5网站布局 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是iframe 的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大家一种iframe动态调整高度的方法，主要是以下js函数： 一、程序代码 functionsetwinheight(obj) html特效代码大全精美免费下载.txt每天早上起床都要看一遍“福布斯”富翁排行榜，如果上面没有我的名字，我就去上班。谈钱不伤感情，谈感情最他妈伤钱。我诅咒你一辈子买方便面没有调料包。 HTML代码大全免费下载 HTML特效代码1。忽视右键 自适应滤波LMS算法及RLS算法及其仿真.
CSS表单设计
目前常见的自适应算法研究与比较
让iframe自适应大小 解决方案
维纳自适应滤波器设计及Matlab实现
fancyBox中文文档(教程) (1)
3. 使页面加载完毕时初始化fancybox() 函数。如果你不懂jQuery但英语还行，请看官方推荐的新手教程。英语不好肿么办？请点右上角的红叉...因为暂时找不到中文版的帮助文档。示例代码： iframe的详细用法
html5,布局,模板
html特效代码大全精美免费下载