我有一個包含iframe的頁面。我正在嘗試將動畫加載到此iframe中。每一段內容都是一個html頁面,其中引用了javascript/jquery腳本,它們可以做類似於動畫的類。例如:
content.html
<head>
<link rel="stylesheet" type="text/css" href="css/slide.css">
<script src="js/library/big_slide_img.js"></script>
</head>
<body>
<img class="big_slide_img" src="http://25.media.tumblr.com/0ab6f805c5a3591168e2fe2133552054/tumblr_mk52iuvbNI1s631nvo1_1280.jpg">
</body>
big_slide_img.js
$(window).load(function()
{
$("#iframe").contents().find('.big_slide_img').animate({left: '-=521'}, 800,function(){});
});
它是如何加載
loadSlide = function(slide_no)
{
$.ajax(
{
url: "http://myurl.com",
async: false,
jsonpCallback: 'jsonCallback',
contentType: "application/json",
type: "GET",
dataType: "jsonp",
data: {"action": "loadall"},
success: function(data)
{
$('#frame_title').html(data.title);
$('#text').html(data.text);
$('#iframe').contents().find('html').html(data.animation);
},
error: function (event, jqXHR, ajaxSettings, thrownError)
{
alert('[event:' + event + '], [jqXHR:' + jqXHR + '], [ajaxSettings:' + ajaxSettings + '], [thrownError:' + thrownError + '])');
}
});
};
我的問題
動畫不一致,我懷疑它是由於$(window).load沒有等到它應該。延遲糾正我所有的問題:
$(window).load(function()
{
$("#iframe").contents().find('.big_slide_img').delay(800).animate({left: '521'}, 800,function(){});
});
我該如何實現這個沒有拖延?由於我不知道這些文件中會包含哪些代碼,因此我希望避免必須從外部監視iframe,並在完成後調用特定的函數。我希望/假設,我只是沒有提到正確的東西。
非常感謝。
的可能重複(http://stackoverflow.com/questions/5788499/jquery-iframe-load-event ) – 2013-05-02 15:58:03