Zi 字媒體
2017-07-25T20:27:27+00:00
HTML5的強大也是需要JavaScript的支持,這裡我們用jQuery來讓HTML5發揮更大的作用,尤其是利用jQuery來操作Canvas繪製更加的方便。本文主要分享一些HTML5結合jQuery的應用實例,並提供源代碼下載,方便學習交流。1、HTML5線性圖表iGrapheriGrapher是一款基於HTML5的線性圖表應用,和之前分享的HTML5線性圖表 圖表數據區域可著色類似,iGrapher也可以按不同的統計範圍來繪製曲線,同時我們在iGrapher中可以利用滑鼠滾輪來縮放統計區間,同時我們可以在menu欄中選擇需要顯示的統計數據。 在線演示 / 源碼下載2、jQuery/CSS3實現超酷的動畫Tab菜單這是一款基於jQuery和CSS3的動畫Tab菜單,這款Tab菜單是以單選框Radio為原型的,通過CSS3樣式特性對radio的渲染,形成了一個外觀看上去像tab菜單的樣子。另外特別的是,tab菜單在切換時內容頁還會出現淡入淡出的動畫效果。 在線演示 / 源碼下載3、jQuery/CSS3帶Tooltip的滑桿動畫今天我們要來分享一款基於jQuery和CSS3的滑桿拖拽動畫,並且在滑桿拖動的過程中,上方有一個Tooltip提示框顯示當前滑桿拖動的數值,並可以實時計算當前的值。而且這個Tooltip提示框是經過CSS3美化過的,外觀十分漂亮。 在線演示 / 源碼下載4、HTML5/CSS3 3D文字外翻效果之前我們分享過一款CSS3 3D文字特效HTML5/CSS3文字投影特效,加上投影和漸變,效果還是非常不錯。今天我們再來分享一款很酷的HTML5/CSS3 3D文字特效,該文字特效的效果是滑鼠滑過文字就會出現3D外翻的效果,非常不錯的一款文字特效。 在線演示 / 源碼下載5、HTML5/CSS3圖片選擇動畫 之前我們已經分享過幾款很酷的HTML5圖片特效,像HTML5 3D圖片摺疊特效、HTML5 3D旋轉圖片相冊等應用。今天我們來分享一款既炫酷又實用的HTML5圖片選擇特效,當圖片被選中時,圖片上就會覆蓋一個半透明的層,上面有一個勾,並且在選中的時候圖片出現彈跳的動畫效果。 在線演示 / 源碼下載6、CSS3波浪形菜單我們分享過許多各種各樣的CSS3菜單,應該說效果都比傳統的CSS菜單強悍。這次要分享的這款CSS3菜單有點特別,菜單的整體形狀類似波浪形,滑鼠滑過菜單項時也會改變背景色表示該菜單項被激活。另外該CSS3菜單結合不錯的背景圖片效果更加震撼。 在線演示 / 源碼下載7、HTML5/CSS3滑塊動畫菜單CSS3菜單我們之前已經分享很多了,有3D菜單、下拉菜單、Tab菜單等,具體大家可以移步至CSS3菜單欄目下查找。今天我們要分享的這款HTML5/CSS3滑塊動畫菜單非常酷,滑鼠滑過菜單項時會有一個漂亮的遮罩移動過來,並且這款動畫菜單還有非常酷的圖標,菜單整體效果很大氣。 在線演示 / 源碼下載以上就是7個最新jQuery/HTML5應用及源碼,歡迎收藏分享。
寫了
5860316篇文章,獲得
23313次喜歡