話說才剛做好 omegaW 1.0 不到三天的時間,就火速的跑出來更新版 2.0。原因是,發現 1.0作的太瞎太爛啦...,不但被大家挑了好多毛病,連我自己也愈看愈淒涼,所以就趁著還有動力的時候,依舊以 網站風+日系風 為主題,進行了一次 update。
果然還是要先在 photoshop把版面做好,再轉成HTML,最後丟到PHP,比較不會出錯。上一版就是在photoshop做了直接轉成PHP,所以就沒時間測試各瀏覽器相容了。
以下簡單介紹 omegaW 2.0 幾個比較不一樣的東西!
▼ 這是之前提過,從傅不死FullHouse 那邊下載來的插件,網站風最重要的就是要有最新公告啊! 所以很感謝傅不死有提供這麼美妙的插件。而且還有訂閱功能耶,也太酷了~
▼ 依然是首頁的部分,點選 Recent Articles 會先預覽文章,再點一次才會進入內文。上一版也有作滑鼠移過才會展開文章的效果,不過上次放的是縮圖,這次改全部。另外因為這版多了一個點擊的動作,所以我也寫了一個關閉的功能。
詳細的應用是從這邊學來的,有興趣的朋友可以參考: jquery實現wordpress首頁文章內容展開預覽效果
▼ 這是我覺得比較有趣的功能,進入內文閱讀,如果隨時想要搜尋其他文章,可以點選左邊的搜尋按鈕,就會跳出搜尋框讓你做搜尋囉!
![]()
接著簡單說一下很夯的HTML5,因為實在很混都沒研究,所以一知半解的先從outline著手。Chrome有個擴充元件: HTML5 Outliner 可以看網頁的大綱,所以我就簡單的設計了一下,依照我的邏輯作區分
▼ 最後首頁長這樣:

▼ 然後這是內文的大綱:





還是要來當過度認真以對的人
1. css 的引入順序,先style.css 再 reset.css 這樣怪怪的吧!~ 雖然結論是正確的
2. jQuery 二次引用的問題還是存。
3. 使用 XHTML 1.0 Strict 宣告
4. IE9 404頁面跑版,firefox, chrome不會
5. IE9 首頁搜尋的放大鏡在第二行,不是最後面
不研究了,繼續認真轉寫 php 程式去~