jQuery和CSS3相結合往往能製作出令人意想不到的網頁應用,比如可以給平淡無光的選單新增3D效果,可以給不起眼的小按鈕增加發光的動畫特效。下面我們就來看看jQuery和CSS3的魅力,這幾款應用有些還是比較實用的。
1、jQuery圖片橫向滾動外掛
這是一款利用jQuery實現的圖片橫向滾動外掛,我們可以設定任意數量的圖片,然後點選左右箭頭按鈕即可分組瀏覽這些圖片。這款jQuery圖片外掛的優勢有兩點,其一是可以定義每組圖片的數量,其二是圖片可迴圈播放,而且簡單實用。
線上演示 原始碼下載
2、實時更新資料的jQuery highcharts圖表外掛
今天我們要來分享一款基於jQuery的highcharts實時圖表外掛,highcharts圖表外掛定義了每隔一秒鐘更新資料,然後根據每個資料點繪製一條折線,隨著資料的更新,折線也就會不停的向前移動,形成一個類似CPU實時監控的曲線圖表。這款jQuery圖表外掛應用比較廣泛,相容所有瀏覽器。
線上演示 原始碼下載
3、jQuery UI滑桿外掛 可Tooltip提示
今天我們再來介紹一款實用的jQuery外掛,是基於jQueryUI的。這款jQuery滑桿外掛非常漂亮,可以設定多種顏色,再加上CSS3上運用,可以讓滑桿的遊標變得有立體感,滑桿的Tooltip提示框也出現飛入飛出的動畫效果。更多jQuery外掛可以移步至jQuery外掛欄目。
線上演示 原始碼下載
4、CSS3個性化價格表 自定義表格單元
這是一款基於CSS3的個性化表格應用,它從某網站的價格表,看起來表格設計非常新穎。演示中價格表的圓形、圓角等效果均通過CSS3實現,這款CSS3價格表外觀非常清新,並且留有很自然的投影和變現處理效果。
線上演示 原始碼下載
5、HTML5 Canvas粒子效果文字動畫特效
之前我們分享過很多超酷的文字特效,其中也有利用HTML5和CSS3的。今天我們要來分享一款基於HTML5Canvas的文字特效,輸入框中輸入想要展示的文字,回車後即可在canvas上繪製出粒子效果的文字動畫,相當酷的動畫效果。
線上演示 原始碼下載
6、jQuery彈出登入表單視窗外掛
這是一款基於jQuery的登入表單外掛,有一點特別的是該登入表單是一個彈出層視窗,表單即嵌在這個視窗裡面,並且彈出層還有一層遮罩將網頁的其他部分遮蓋住。表單在彈出的時候利用jQuery的動畫特性將會出現淡入淡出的迷人效果。
線上演示 原始碼下載
7、CSS3個人部落格選單動畫 簡潔的選單樣式
這是一款基於純CSS3的選單導航,由於它簡潔的外觀樣式,所以可以用來做個人部落格的選單導航。這款CSS3選單採用的是黑色的背景,當滑鼠滑過選單項時,背景顏色就會變成漸變的藍色,色彩搭配非常合理,並且在滑鼠滑過是帶有向上滑動的動畫效果。
線上演示 原始碼下載
8、CSS3仿wordpress網站後臺管理選單導航
這次要分享的是一款CSS3仿wordpress後臺管理選單導航,用過wordpress的朋友應該比較熟悉,它後臺管理的選單是縱向的,並且選單項都有小圖示。這款選單就用CSS3來實現了wordpress後臺風格的選單樣式,適合在你的網站後臺使用,非常實用。
線上演示 原始碼下載
以上這些jQuery外掛和CSS3應用希望可以幫助到你,歡迎收藏分享。
本文作者:html5tricks –超人
相關閱讀
評論(0)