DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁製作工具 >> Fireworks入門知識 >> Fireworks基礎 >> Windows 桌面風格頁面制作點滴 鍵盤的操作
Windows 桌面風格頁面制作點滴 鍵盤的操作
編輯:Fireworks基礎     
為了使網頁更形象,我可以用鍵盤事件來進行網頁操作,如用鍵盤打開開始菜單,Esc鍵隱藏對話框等等。這裡要用到了&111nkeydown;下面是一個例子:



  當在當前頁回車時,就會打開網頁陶吧http://homepage.yesky.com,這裡的13代表回車鍵。
  將下面代碼存為htm文件,就會顯示各個字母代碼的數字(IE浏覽器適用)。


  網頁進度條:

   思路是根據源文件下載的進程來實現的,把源文件分為幾個部分,每隔一部分,加一段代碼,來動態改變一個圖片的長度.顯示出下載的進程和百分比。

困難和解決:

  由於網頁代碼繁長,用到很多的小圖片與大量的&106avascript。網頁的更新維護將是一件很頭痛的事。

  下面是一些解決的方法:
  對於每個層的ID名稱的的命名,要根據層的內容。例如個人說明的層用 id="readme" 開始菜單 id="startmenu"等等。這樣是為了更好的對源文件進行改進和優化。同一類層的z-index設置相同,誰在上,誰在下,都是要考慮的。

  對於很多重復使用的一項代碼,我們可以用document.write來寫成&106avascript,像桌面圖標等,下面是一個例子:

function link(act,txt)
{document.write("<div class=link &111nMouseOver=this.className='overlink' &111nMouSEOut=this.className='link' style='padding-left:16;padding-top:1;padding-bottom:1' &111nclick="+act+">"+txt+"

")}

  如果網頁中有十處用到這個代碼,我們就要寫進十個上面粗體代碼長度,但通用&106avascript,我們就可以只寫十個這樣的代碼:
,這樣使源文件更清晰,更容易看。

  把所用的到的funtion函數全部放在JS文件中,這樣不會使風頁文件太大,而出現打不出的現象,同時也更好的管理。

  不足

  Windows桌面風格的網頁只能是個網頁,不能像Windows系統一樣的功能強大,再加上現在浏覽器的差異性,在不同的浏覽器下看到的效果也是大相徑庭。

  收獲和經驗

  這個網頁網頁的實現過程,也是我認識了解CSS、Javascript、Html過程,是我水平進步的過程。從中也體驗到編改寫代碼的樂趣,有時候為了一個代碼要想很久,不能解決就到論壇求助,問題很快就解決了。如果大家有興趣,可以到我的網頁上最新版本 0324 下載源文件

  要做出一個桌面風格的網頁,對於網頁初學者來,是有一定困難的。也許你對上面所提到的代碼很陌生,那也沒關系,只要你對網頁學習有興趣,認真學習網頁制作的基礎知識,相信不久你的手中會誕生出更有創意的網頁。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved