使用jquery為iframe內容添加動畫效果

Question

我在Web應用程序中動態設置iFrame的內容。 是的，遺憾的是需要使用iFrame :)不使用跨域內容

我能夠設置內容，在iframe中找到元素等。但現在我想在iframe中設置一些元素的動畫。 在應用程序中我沒有收到任何錯誤消息，fadeIn（1000），fadeOut（1000）和animate只是根本不做任何事情。 該應用程序的架構將是復雜的小提琴重建，但我做了以下。

將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>'))

這是一個小小提琴，我試圖將其分解，但是jsfiddle不會讓我在JS窗口中編寫html所以我無法使附加部分工作。

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

甚至可以在iframe中的元素上使用jquery方法和動畫嗎？ 。

編輯：

我已經設法在@P之后的簡單jsfiddle中為元素設置動畫。 弗蘭克回答。 但是，嘗試在更復雜的iframe環境中為元素設置動畫失敗，如此更新的小提琴中所示：

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

（好吧，我覺得它有點有用，但是速度慢，波濤洶涌，所以看起來根本不像動畫。有時元素在動畫結束時就消失了，根本沒有任何褪色。

關於如何在這樣的iframe環境中運行流暢動畫的任何想法？

Answer 1

試試這個。 工作得很好

https://jsfiddle.net/95b6ezkv/

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