javascript - 使用 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 窗口中编写 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.
});