現在網頁上的圖片已經不再是10幾年前那種低像素的靜態圖片了，有了HTML5和jQuery，我們可以讓一張普通的圖片變得多姿多彩，特別是利用HTML5，還可以實現一些很複雜的圖片動畫特效。下面分享的10款圖片特效就是基於HTML5和jQuery的，一起來看看吧。
1、HTML5相冊照片瀏覽器 可連接Flickr照片服務
以前我們經常會分享一些jQuery相冊瀏覽插件，效果不錯，實用性也很強。不過如果能利用HTML5來實現相冊瀏覽器，那麼相冊瀏覽效果肯定會更加炫酷。今天分享的這款HTML5相冊瀏覽器可以連接到Flickr獲取照片，也可以連接到youtube獲取視頻，照片在初始化的時候有波浪般的效果。
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相冊分享給你的朋友吧。
6、CSS3圖片懸停放大特效
今天我們要來分享一款很酷的CSS3圖片特效，這款圖片特效可以利用鼠標滑過圖片使其懸停放大，並使圖片的周圍出現發光的效果。配合黑色的背景，這款CSS3圖片懸停放大效果顯得更加立體大氣，非常適合產品圖片的展示。
7、CSS3圖片層疊展開特效 可展開扇形效果
今天要分享的這款CSS3圖片特效沒有那麼絢麗，它的功能非常簡單，當你把鼠標移到圖片上時，多張圖片便會由原先的疊在一起變成展開狀態，展開過程中伴隨CSS3動畫，展開的形狀是扇形。這款簡單的CSS3圖片層疊展開動畫可以應用在圖片展示和圖片分享上。
8、CSS3迷你圖片切換組件 可添加圖片描述
圖片切換在WEB2.0中應用十分廣泛，今天分享的這款CSS3迷你圖片切換組件有着自己的優勢和特點。點擊切換按鈕時，按鈕會出現漸隱漸顯的發光特效，圖片切換過程中整張圖片過渡的效果非常柔和，並且圖片描述也相應以動畫的方式顯示在圖片上，是一款非常棒的CSS3圖片切換組件。
9、CSS3百葉窗圖片切換 圖片很美
這款CSS3圖片切換插件非常漂亮，圖片切換是百葉窗的效果，更值得注意的是插件提供了4種不同的百葉窗特效，有水平百葉窗、垂直百葉窗和淡入淡出百葉窗等。並且，該CSS3百葉窗圖片切換插件切換時非常平滑，效果很不錯。
10、HTML5動畫圖片播放器 高端大氣
我們見過很多圖片播放插件（焦點圖），很多都基於jQuery。今天介紹的HTML5圖片播放器很特別，它不僅在圖片間切換有過渡動畫效果，而且在切換時圖片中的元素也將出現動畫效果，比如圖中的文字移動、打散、重新組合等。這款HTML5動畫圖片播放器算得上是高端大氣上檔次。
以上就是10款讓人驚歎的HTML5/jQuery圖片動畫特效，歡迎收藏分享。 轉載請註明原文鏈接：http://www.html5tricks.com/10-html5-jquery-image-animatin.html
