頁面加載必要時使用jQuery

例如後更改DIV高度我有3頁：
第1頁與<div id="header" height="460">，
第2頁與<div id="header" height="100">，
第3頁與<div id="header" height="100">。頁面加載必要時使用jQuery

在第一頁上我將高度設置爲460px，但是當我將其更改爲任何其他頁面（例如page2）時，它應該加載頁面，然後將其從460px移動到100px，之後如果點擊page3我希望它能夠識別它已經設置爲100px，並且不需要動畫，但是如果我點擊回頁面1，它會加載page1並將動畫回到高度460px。

在此先感謝

之前，我試圖用這樣的：

$('#buttonToPage2').click(function(){ 
    $('#header').animate({height:'100px'}, 500); 
}); 

$('#buttonToPage1').click(function(){ 
    $('#header').animate({height: '460px'}, 500); 
});

但它加載頁面之前動畫。

P.S. 對於這個問題，我不太適合使用JQuery或JavaScript。

來源

2011-06-16 Teodors

你先試過了嗎？你有什麼代碼？ – 2011-06-16 10:23:01

當你說動畫時，你的意思是慢嗎？ – 2011-06-16 10:24:55

當然，當你加載每一頁時，div會有你想要的高度。也許我錯誤理解你的要求？ – belugabob 2011-06-16 10:26:26

這是一個非常古老的問題，我有。當時我不熟悉AJAX。我希望從一個頁面到另一個頁面的平滑過渡。

當時我以某種方式想將前一頁信息傳遞給下一個，但我真正需要的是pushState API，也許是像Angular或Vue這樣的前端框架。

對於較小的頁面我現在用Page.js管理國家和Pug.js模板引擎，但你可以使用像鬍鬚，Hogan.js或一些其他的模板引擎。通過這種方式，您可以在不重新加載頁面的情況下使用JavaScript進行轉換。

來源

2016-09-18 10:11:45 Teodors

你可以試試這個：

$('#header').animate({ 
    height: '100px' 
}, 5000, function() { 
    // Animation complete. 
});

只要儘快把這個作爲加載完整的頁面。

來源

2011-06-16 10:26:52

$(#header).height(100).slideUp(); 
$(#header).height(460).slideDown();

就叫他們$(document).ready()

來源

2011-06-16 10:32:28 Balanivash

頁面加載必要時使用jQuery

回答

相關問題