現在網頁上的圖片已經不再是10幾年前那種低像素的靜態圖片了,有了HTML5和jQuery,我們可以讓一張普通的圖片變得多姿多彩,特別是利用HTML5,還可以實現一些很複雜的圖片動畫特效。下面分享的10款圖片特效就是基於HTML5和jQuery的,一起來看看吧。
1、HTML5相冊照片瀏覽器 可連接Flickr照片服務
以前我們經常會分享一些jQuery相冊瀏覽插件,效果不錯,實用性也很強。不過如果能利用HTML5來實現相冊瀏覽器,那麼相冊瀏覽效果肯定會更加炫酷。今天分享的這款HTML5相冊瀏覽器可以連接到Flickr獲取照片,也可以連接到you**獲取視頻,照片在初始化的時候有波浪般的效果。
2、CSS3圖片模糊效果
今天我們來分享一款利用CSS3技術讓圖片模糊的效果,我們只需要將鼠標滑過圖片,就可以讓圖片產生模糊的特效,利用CSS3實現圖片模糊效果也非常簡單,用CSS3中的filter屬性即可,針對不同瀏覽器用-webkit-filter、-moz-filter、-o-filter和-ms-filter。
3、HTML5 3D幻燈片播放特效 可自定義圖片參數
今天我們要來分享一款功能非常強大的HTML5幻燈片播放特效,圖片是響應式佈局,可以根據窗口大小自動展示成一列或者兩列。點擊圖片即可展示圖片的詳細信息,包括圖片的文字描述。圖片在展開的時候有非常酷的3D特效,相當不錯的HTML5幻燈片插件。
4、HTML5 3D旋轉圖片相冊 可鼠標懸停
圖片特效在HTML5應用中十分廣泛,我們也在html5tricks上收集了不少HTML5圖片特效,今天要分享的這款HTML5 3D旋轉圖片相冊又非常絢麗,和之前分享的這款HTML5/CSS3 3D環形圖片牆類似,也是一面立體的圖片牆,圖片不停的切換,鼠標滑過圖片時即可激活圖片查看。
5、HTML5 3D相冊瀏覽 震撼人心
前幾天我剛剛分享過一款HTML5 3D圖片插件HTML5 3D立體圖片旋轉播放展示,確實利用HTML5技術來做各種圖片動畫都非常炫。今天我們再來看一款HTML5 3D相冊瀏覽應用,圖片可以手動播放,也可以自動播放,效果非常震撼,趕緊把這款HTML5 3D相冊分享給你的朋友吧。