Jquery和Ajax动态加载IFrame

我有一个动态加载网页内iframe的脚本。 你可以在这里看到演示： DEMO

我想使用jquery来实现类似的rseult，但是有一个很好的滑动效果，以及在另一个div中加载iframe的外部链接。 基本上，我在页面上有10个链接。 单击链接时，我希望iframe窗口加载新内容并将效果应用于过渡。 有没有人知道为此存在的任何插件？ 我没有足够的经验从头开始编写脚本，所以任何帮助都将非常感谢！

Answer 1

根据评论改变了……

给出一个类似的页面

尝试类似下面的内容

 function loadFrame() { var j$ = jQuery.noConflict(); var frames = j$('.frameToChange'); frames.each(function(index) { j$(this).slideDown('fast'); j$(this).attr('src', j$(this).attr('link')); }); } 

Answer 2

我使用以下内容：

 $('iframe').load(function() { $(this).animate({ 'height': this.contentWindow.document.body.scrollHeight + 'px' }); }); 

Answer 3

您可以使用jQuery为iframe设置动画，也可以为iframe的内容设置动画。

使用iframe执行任何操作的缺点是它们不允许父级中的脚本与iframe内运行的脚本进行通信。 它被称为跨域限制，用于防御来自不同域的恶意脚本。

因此，如果您打算为iframe的内容设置动画，则需要将动画实现为在iframe中加载的页面的一部分。 否则，为了动画iframe本身，jQuery已经具有一些在此描述的基本动画function。

Answer 4

jQuery内置了幻灯片效果。 您可以通过使用两个iframe（称为旧的和新的）并使用幻灯片效果在它们之间进行转换来实现您要查找的内容。