Jquery和Ajax动态加载IFrame

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

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

根据评论改变了……

给出一个类似的页面

   

尝试类似下面的内容

 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')); }); } 

我使用以下内容:

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

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

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

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

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