使用JQUERY Tabs插件宿主IFRAMES

核心提示： 隐藏代码不需要做过多的解释，关键的动作是创建和设置HtmlGenericControl列表项，使用JQUERY Tabs插件宿主IFRAMES(9)，最后它通过编程被添加tab panel中，遇到的问题我遇到的主要的问题是跨浏览器的情况下自动适应IFRAME的大小，通过一个标签界面宿主外部网站内

隐藏代码不需要做过多的解释，关键的动作是创建和设置HtmlGenericControl列表项，最后它通过编程被添加tab panel中。

遇到的问题

我遇到的主要的问题是跨浏览器的情况下自动适应IFRAME的大小，该方案在IE 8，Firefox v3.5.6，和谷歌v3.0.195.38浏览器进行测试。

我必须进行浏览器检测，根据IFRAME在三个浏览器测试的尺寸，调整相应的宽度和高度。当浏览器改变大小的时候，Chrome 和FireFox看起来IFRAME有个固定的高度。　但是，　IE8看来来会丢失在IFRAME和浏览器顶部之间的padding。调整宽度和高度特别是IE似乎应该尽可能的减少IFRAME到IE浏览器窗口的底部“蜷缩”影响。

限制

1、以下JavaScript将使你加载的网页跳出IFRAME，我不知道任何解决办法此（如果存在）。Code Project 网站上目前拥有类似下面的代码，这样配置选项指向http://www.codeproject.com/非常的容易，这里重现描述的动作。

<script　type="text/javascript"　language="javascript">
　　　　if　(top!=self)　top.location.href　=　location.href;
</script>

2、在浏览器中，Web网页被迫改变页面本身的大小，有可能跳出IFRAME窗体，从而取代了前父窗口。

3、我没有使用Safari，Opera，早期版本的IE浏览器，或任何其他浏览器的早期版本测试的此解决方案，所以要在Home Site中适当地调整heightAdjust和widthAdjust变量，适应没有测试的IE浏览器或低于IE8浏览器的版本。

总结和兴趣点

虽然这种解决方案不是很复杂，通过一个标签界面宿主外部网站内容。这是我所见过的许多网络论坛和博客要求的功能。请注意：您也可以配置标签可显示自己相关的域名或网站（在同一台服务器）。

出处：http://zhuqil.cnblogs.com

本文示例源代码或素材下载