使用 jquery 动画化 iframe 内容

Question

我正在 Web 应用程序中动态设置 iFrame 的内容。是的，不幸的是需要使用 iFrame:) 没有使用跨域内容

我能够设置内容，在 iframe 中查找元素等。但现在我想为 iframe 中的一些元素设置动画。在应用程序中，我没有收到任何错误消息，fadeIn(1000)、fadeOut(1000) 和 animate 根本不执行任何操作。在 fiddle 中重新创建应用程序的架构会很复杂，但我正在执行以下操作。

将 iframe 添加到站点，等待 iframe 加载，访问内容并将 jquery 附加到 iframe 的头部：

head.append($('<script type="text/javascript" charset="utf-8" async="" data- requirecontext="_" data-requiremodule="jquery" src="/assets/js/vendor/jquery-2.1.3.min.js"></script>'))

~~这是一个小 fiddle ，我试图将其分解，但 jsfiddle 不允许我在 JS window 中写 html 所以我无法得到附加部分工作。~~

~~https://jsfiddle.net/MacG/Lnwx8seg/7/~~

~~甚至可以在 iframe 中的元素上使用 jquery 方法和动画吗？~~。

编辑：

我已经设法在 @P 之后的一个简单的 jsfiddle 中对元素进行动画处理。坦白回答。然而，尝试在更复杂的 iframe 环境中为元素设置动画失败，如更新后的 fiddle:

所示

https://jsfiddle.net/MacG/5ryLdnLz/1/

（好吧，我想它有点管用，但是速度慢而且起伏不定，所以它看起来一点也不像动画。有时元素只是在动画结束时消失，没有任何褪色全部.

关于如何在这样的 iframe 环境中制作流畅的动画有什么想法吗？

Answer 1

试试这个。工作正常

https://jsfiddle.net/95b6ezkv/

$(header).animate({
    opacity: 0.25
  }, 5000, function() {
    // Animation complete.
});

使用 jquery 动画化 iframe 内容

Animate iframe content with jquery

javascript

iframe

jquery

jquery-animate