利用CSS製作寬景圖片檢視器

設計網頁最常見到的的就是圖片這個元素了,而其中又以檢視大圖最為常見,像是清明上河圖這種超級寬景圖,早期大概都採用FLASH拖拉檢視,如果搭配Javascript其實也能達到很不錯的效果,那…採用純CSS的話呢?以下是Amos嘗試採用純CSS製作出來的範例,整個例子除了清明上河圖使用到圖片外,其餘如相框檢視框、箭頭、縮圖框、縮圖框兩邊…等,都採用CSS直接撰寫,分享給大家看看囉。

不過在這個例子中,原始碼撰寫會比較辛苦一點,如果要要求效率的話,Amos 還是覺得用Javascript會比較好喔~但可以想見的是~CSS真的是越來越多可以發揮的了。