jquery動畫不是動畫

我正在使用jquery動畫功能的網站上工作，從加載時從左上角擴展網站。我實際上並不是那個爲該功能編寫代碼的人，所以我不太熟悉它。它確實有效，但目前看來根本沒有工作。我知道.js文件正在加載並且正在運行，因爲其中的第一個代碼是顯示「頁面正在加載」消息的時間延遲。但是，它只是顯示已經加載的頁面，而不是動畫顯示從左上角出現的頁面並滑入頁面。我包括了CSS並且標記了，儘管我不相信這是問題所在。任何幫助，將不勝感激！謝謝！jquery動畫不是動畫

注：我們正在使用jQuery 1.7.2版本

的CSS：

#builder 
    { 
     position:relative; 
     min-height:100%; 
     min-width:100%; 
     z-index:999; 
    }

中的JavaScript：

function hideIt() { 

    document.getElementById("wait").style.display = "none"; 

} 

setTimeout("hideIt()", 1000); 

function showIt() { 

    document.getElementById("builder").style.display = "block"; 
} 

setTimeout("showIt()", 2500); 

function build() { 
    $(document).ready(function() { 

     $("#builder").animate({ height: '0%', width: '0%' }, 1); 
     $("#builder").animate({ height: '100%', width: '100%' }, 2000); 


    }); 
}

的標記：

<body onLoad="build()"> 
<img src="wait.gif" id="wait" style="display:block;" />

wait.gif僅僅是說「頁面加載」圖片...

和頁面被包裹在這些：

<div id="builder" align=center style="display:none;">

來源

2012-07-03 Blake

如果#builder元素在顯示前隱藏了2.5秒，那麼動畫將在元素顯示時完成。對身體的onLoad刪除內聯函數和嘗試：

function hideIt() { 
    $("#wait").hide(); 
} 

function showIt() { 
    $("#builder").show(2000); //should do somewhat the same as animating from the top left 
} 

$(function() { 
    setTimeout(hideIt, 1000); //no need to quote the functions and eval them 
    setTimeout(showIt, 2500); 
});

或只是

$("#wait").delay(1000).hide(10); 
$("#builder").delay(2500).show(2000)

來源

2012-07-03 01:02:55 adeneo

這實際上正是他們想要它做的事情，但它只是動畫背景圖片而不是頁面上的所有內容...... – Blake

不確定內容未被動畫是什麼意思，在#builder元素中，否則它當然不會被動畫，或者它只是不按照你喜歡的方式動畫？ – adeneo

我認爲這很可能是問題所在，某些標記可能需要更改，明天我將不得不看看它，因爲我已經完成了晚上的工作，非常感謝您的幫助！ – Blake

嘗試調整像這樣的代碼：

$(document).ready(function() { 
    $('#wait').hide(1000, function(){ // hide the #wait 
     $("#builder").show().animate({ // then show, then animate #builder 
      height: '100%', 
      width: '100%' 
     }, 2000); 
    }); 
});

附註：請記住，當您使用百分比和包含#builder的元素時，還需要設置其高度和寬度。

來源

2012-07-03 00:52:24 Joey

我嘗試過，但與JavaScript的它從來沒有得到過頁面加載消息... – Blake

我在做編輯代碼。此外，如果您現在在文檔良好並加載時調用'build（）'，則可以從body標籤中刪除onLoad屬性。 AND：動畫在'＃builder'被顯示之前很久就發生了。我認爲你希望它在第一次出現的時候能夠製作成全尺寸的動畫？ – Joey

好吧，我從我的身體標記中刪除了onload，並用新的代碼替換了舊代碼，但它仍然沒有越過該頁面正在加載的圖片。 – Blake

很可能在您的show()被調用之前很久就會動畫了。所以當它顯示時，動畫就完成了。

來源

2012-07-03 00:52:42

jquery動畫不是動畫

回答

相關問題