動態網頁滑動良好的腳本練習？

我想要編寫一個網站，它將在左側有一個菜單：動態網頁滑動良好的腳本練習？

當點擊這個菜單上的一個項目時，站點向上或向下滑動（但不應有向上或向下滾動的選項）。

現在，當用戶與網頁中的某些內容（而非菜單）進行交互時，該網站會左右滑動。

所以有沒有重新加載的網站！

例如，菜單包含主頁和帳戶。

如果用戶是在家裏和上acount點擊網站下滑（但他不應該由他本人向下滾動選項）！

現在在帳戶當他點擊一個名爲「編輯帳戶」按鈕，該網站的幻燈片（但沒有菜單）右側的頁面中，他不能當他打救的網站上編輯他的賬戶滑回帳戶

與網站我的意思是一個內部預先定義的框當然頭和頁腳不會移動！

這是我在jsfiddle上寫的腳本的一個小例子。

我知道這看起來很酷，但我不希望用戶需要犧牲網站加載速度只是爲了一個很酷的滑動效果！

現在我的問題是：這是不錯的編程習慣？

來源

2012-01-12 Jimbo Mombasa

的權利，如果我相信對你想要的東西，像我的網站「www.ohlookawebsite.com」你需要做的是使用jQuery的.show和這樣的創造作用，從而例如

<div id="navagation"> 

<div id="home" onclick="homeClick()">Home</div> 
<div id="about" onclick="aboutClick()">About</div> 
<div id="account" onclick="accountClick()">Account</div> 

</div>

這將是導航，那麼你可以在頁面上設置<div>，並且不應該使用style="display: none;"來顯示，例如;

<div id="boxHome"> 
Welcome to the home page! 
</div> 

<div id="boxAbout" style="display: none;"> 
Welcome To the About Page! 
</div> 

<div id="boxAccount" style="display: none;> 
You're account info! 
</div>

您將需要使用jQuery和JavaScript來顯示不同的「頁面」

function homeClick(){ 
    $("#boxAbout").fadeOut(500); 
    $("#boxAccount").fadeOut(500); 

    $("#home").css("color", "green"); 
    $("#boxHome").delay(500).fadeIn(1000); 
}

這裏你可以看到這樣一個例子：http://jsfiddle.net/gM4hB/4/

希望這有助於

來源

2012-01-12 10:46:36 obkso

動態網頁滑動良好的腳本練習？

回答

相關問題