繼Google網頁傾斜後,我的網站也斜了!?

最近Google行動版的傾斜網頁在台灣媒體界爭相報導之時,我的網站也不明原因的傾斜了。在火狐中網頁已經呈現傾斜狀態,想說可能是網頁瀏覽器問題,於是打開了Chrome看看…不料,Google大神的瀏覽器居然也是這副德行!還少了字! 那麼Opera呢?天啊啊啊啊啊啊!我明明就沒在搜尋欄上打傾斜,我也不是手機板啊,怎麼會這樣呢???? 難道是被駭客入侵?

IE瀏覽器無法呈現此效果。Firefox為最佳效果。

最近Google行動版的傾斜網頁在台灣媒體界爭相報導之時,我的網站也不明原因的傾斜了。

在火狐中網頁已經呈現傾斜狀態,想說可能是網頁瀏覽器問題,於是打開了Chrome看看…

不料,Google大神的瀏覽器居然也是這副德行!還少了字! 那麼Opera呢?

天啊啊啊啊啊啊!我明明就沒在搜尋欄上打傾斜,我也不是手機板啊,怎麼會這樣呢???? 難道是被駭客入侵?

其實,不是駭客入侵,也跟瀏覽器沒關係(IE? 忽略XD),這是CSS3的特效語法 transform 的其中一個應用「旋轉(rotate)」。基本語法參照以下:

只要把以上這三行程式碼插入CSS語法的body標籤中,你的網頁就會整個傾斜囉!

如何? 是不是很有趣呢? 你可以嘗試著把 rotate(0.5deg) 的數字部分改成任一你想要的數值去嘗試看看,當然他也能套用在其他的語法裡面,例如滑鼠移到連結上時會翻轉、移到圖片上時圖片轉動..等等,詳細動畫使用可以參考CSS: Animation Using CSS Transforms這篇文章的內容,他底下有個火箭的小小範例可以玩玩看,當然,他還有提供這範例的CSS程式碼,有興趣可以弄下來嘗試看看。

喔,對了,他文章一開始的右邊那個小方塊當你滑鼠移過去時會旋轉並放大,這也是利用CSS3達成的,這在那篇文章裡也有相關的解釋,這邊我就不多做說明了,留給客倌們嘗試看看囉~ (基本上是把程式碼複製起來然後直接實測最快 XD(被打))

網頁加速開啟之JavaScript拖延術。

前一陣子,覺得右邊那個廣告的載入速度似乎拖慢了整個網頁開啟的速度,每次開啟都是主要內容先跑,側邊攔卻等了許久才動起來…

其實,之前就有把那個廣告的部分弄上了延遲的語法,但似乎都沒有明顯的效果,直到前幾天的靈光一現,發覺我好像放錯地方了,經過一些調整後,開啟速度果真快了很多,至少文字部分都出現了!

繼續閱讀 “網頁加速開啟之JavaScript拖延術。"

再續Flash不只是動畫 – 留言版篇。

20110331更新,展示網址更新為Beta 101203版。

20100412更新,已將正式源碼放上。

本次更新同步發表於有明大戰

唉呦,跟上一篇差了四個多月的這一篇文章其實有著很重要的目的。

更新版本號為 v0.9.1 Beta 看起來是很小的更新,但這對我來說是一項很重要的紀錄。雖然修改的過程我只花了兩天的時間,但是那兩天我費了很大的力氣、查遍許多相關的網站(都是簡體的,好怪)才把這一個安全性的問題給它弄出來。

所以,你知道我更新了什麼嗎?

不知道不要緊,趕快進來我慢慢的跟你說。

繼續閱讀 “再續Flash不只是動畫 – 留言版篇。"

Ajax – 讓你的WordPress內建留言系統動起來!

前幾天的某個很無聊的夜晚,在網路的大海上釣著魚……一不小心就在這裡釣到了一條滿有趣的大魚。

它是一隻用在WordPress下的外掛程式,主要是利用原有的評論模板加上一些Ajax的程式碼之後所完成,安裝與設定都非常的簡單,且檔案極小,僅有數十KB的大小且執行速度極快,對於網站開啟速度並沒有太明顯的影響。

繼續閱讀 “Ajax – 讓你的WordPress內建留言系統動起來!"

續FLASH不只是動畫 – 留言板篇。

20090909新增第二載點。

好,今天這一篇是延續上一篇的延伸內容。
歷經了四天,我加強了整個留言版的功能,變得更強大,雖然版面還是醜醜的。

另外,這次發文的目的就是要來解說搞了我將近24小時的管理系統……等等再來解是怎麼弄了這麼久。

這個留言版正式命名為:FGuestBook v0.9 Beta 公開測試版!

繼續閱讀 “續FLASH不只是動畫 – 留言板篇。"