回覆列表
  • 1 # 使用者1106545292442

    工具類

    方便操作物件,陣列等的工具庫

    underscore.js

    lo-dash 與underscore.js的api基本一致。與underscore比其優勢是,效率高;可自定義構建

    Sugar 在原生物件上增加一些工具方法

    functional.js 提夠了一些Curry的支援

    Watch.js 監視物件或屬性的變化

    bacon.js 函數語言程式設計,cool

    streamjs 用流的方式來對陣列,物件進行系列操作

    非同步流程控制

    eventproxy 樸靈出品

    Arbiter.js 詳細

    釋出訂閱

    q Promise風格的

    Async.js

    mock

    Mock.js 生成隨機資料和mock Ajax 請求

    jquery-mockjax mock ajax請求

    時間庫

    moment

    datejs

    瀏覽器探測

    Bowser 探測具體瀏覽器和版本

    ua-parser-js 探測具體瀏覽器和版本,作業系統,裝置型別等

    除錯

    console-polyfill 能放心的使用 console.log()之類的console方法

    log 讓控制檯輸出的log有樣式

    Konsole.js 在頁面的一個元素裡輸出log資訊 詳細

    uri.js uri操作

    cookie 增刪改cookie的工具庫

    director 前端路由庫 詳細

    BigDecimal.js 提高精度的數字操作

    JSDoc 根據javascript檔案中註釋的資訊,生成API文件 詳細

    hotkeys 鍵盤事件的封裝

    MD5 用 MD5 的方式加密檔案的庫

    瀏覽器增強類

    讓一些舊瀏覽器變牛逼的庫

    Selectivizr 讓IE 6-8一些的css3選擇器

    ieBetter 讓ie6-8有高階瀏覽器的特性

    ExplorerCanvas 讓IE8-的瀏覽器支援canvas

    CSS3 Pie 讓IE6-9支援border-radious,box-shadow,linear-gradient。 可以使用.htc檔案(注意Mine type)或.js檔案。在用Pie.js時,box-radious的元素有背景色時,不顯示背景色。。。

    formFive 讓舊的瀏覽器支援HTML5表單的一些特性,如 placeholder,autofocus

    https://github.com/anselmh/object-fit 讓瀏覽器支援object-fit這css規則

    HTML5 Cross Browser Polyfills 一堆Polyfills

    flexibility 讓舊的 IE 也支援 Flexbox

    選擇器增強

    Lining.js 讓瀏覽器實現類似::nth-line(), ::nth-last-line()的效果

    未歸類

    prefixfree 用了它,寫css時,就不需要加瀏覽器的字首了

    表單類

    jquery-file-upload 上傳檔案元件 詳細

    zTree 檔案樹形檢視控制元件

    Treed 樹編輯器。感覺展示的感覺很像思維導圖

    FileAPI 對檔案選擇框內的檔案的一些處理

    表單驗證

    .Validate 詳細

    jQuery-Validation-Engine

    表單元素美化

    select2 多選下拉框

    selectivity 和unfirom比較類似

    DropKick 下拉框,單,多選。外觀比uniform好

    switchery ios7風格的開關元件

    nouislider 用捲軸來設定/控制(音量等)

    range.css 美化input[type=range]元素的外觀

    圖片類

    holderjs 生成佔位圖片

    lazyload

    imagesLoaded 選取的圖片都載入好後執行調回

    CSSgram 用CSS3的Filter實現Instagram濾鏡的庫

    圖示類

    Icon Font彙總

    SVG做的圖示

    svgicons

    iconic

    HYBICON 帶互動效果。如 hover, click

    HTML字元實體圖示

    http://www.amp-what.com/

    css3patterns css3 做的可平鋪紋理。瀏覽器相容性不好。

    瀏覽圖片

    fancybox 彈出檢視圖片,視屏等等 demo

    yoxview 彈出檢視圖片,圖片尺寸縮放很自然

    圖片牆

    wookmark

    UI 框架

    Framework7

    UI 元件類

    拖拽

    dragula 支援Draggable,Dropable和Sortable。感覺比jqueryUI的輕量級,好用的樣子

    angular-dragula dragular 官方的 angular 版本

    資料視覺化(圖表)

    Echarts 百度出品

    highcharts 功能強大。是收費的。

    Plottable.JS 基於D3的一個圖表庫

    flot 文件不給力

    chartJs 中文文件 demo很漂亮,很清晰。比較輕量級。

    ichartJs 中國的一個傢伙搞的,感覺還不錯。

    時間選取元件

    foundation-datepicker

    DatePicker 一個簡單的日曆 詳細

    full calendar 支援脫放的方式來改變待辦事宜的時間

    Simple Events Calendar 外觀很喜歡。收費 5$

    jQuery ui datepicker 經典,不是很好看

    pickadate 輕量級,手機友好的,漂亮。但貌似只能在彈出層中顯示,而沒有下拉這種方式顯示。

    zebra-datepicker 可配置性很強。但貌似只能在彈出在右上方。。。

    bootstrap-datepicker bootstrap風格。

    dateRangePicker 選取時間段。bootstrap風格。該元件依賴Twitter Bootstrap, Moment.js和jQuery.

    自定義捲軸

    perfect scrollbar 輕量級的捲軸。外觀與mac上chrome的捲軸一樣。

    iscroll 在移動裝置上用不錯

    載入(Loding)效果

    CSS Spinners CSS做的

    Loaders.css CSS做的

    表格元件

    jsGrid Data Grid。 詳細

    backgrid 基於Backbone.js的DataGrid

    excellentexport 把表格的內容生成excel。相容 Firefox, Chrome, IE6+

    handsontable 生成Excel外觀的資料

    JSpreadsheets 表格資料的元件庫

    選取顏色

    Spectrum

    分享到SNS

    JiaThis 生成分享程式碼。

    編輯器

    ace 程式碼編輯器,可以用來做demo演示

    ckeditor

    ueditor 百度做的

    tinymce 對html內容進行實時的編輯

    summernote 在移動裝置上用不錯

    通知元件

    notie.js

    HTML5播放器

    jwplayer 被大量網站使用

    html5media 簡單的h5player,輕量級

    jplayer 功能強太,可換膚

    展示

    Impress.js 各種旋轉,和奇特的體驗

    fullPage 全屏顯示。用滾輪來翻頁 詳細

    zepto.fullpage 專注於移動端的fullPage.js,依賴Zepto

    pagePiling 和fullPage類似

    turn.js 做一本書,帶漂亮的翻頁的效果

    幻燈

    slidesjs 挺好用的,只是那幻燈導航的CSS都要自己寫,呵呵 詳細

    iSlider 無任何外掛依賴的手機平臺javascript滑動元件 詳細

    bgstretcher 全屏幻燈,會隨著頁面大小的變化而變化。

    Swiper 開源、免費、強大的移動端觸控滑動外掛 Swiper中文網

    coin-slider 相容IE6。蠻好的~。不過其切換方式是一塊塊的。不能配置切換方式。。。

    wowslider 幻燈切換時各種很炫的效果。收費。

    cycle2 普通的幻燈,竟然不支援垂直滾動。。。

    jcarousel 普通的幻燈,不相容IE6

    reveal 3d滾動。做ppt相當不錯

    nodePPT 華人做的,做ppt也相當不錯。有些方面比 reveal做的還好。但生成匯出的html有些問題

    roundabout 3d切換,看的後面圖片的邊

    彈出框

    Magnific-Popup 相容PC,Mobile。還不錯,有5k+的star

    layer 華人開發的,相容ie6+。不喜歡其呼叫方式。

    動畫效果

    mixitup 用漂亮的動畫效果來完成排序和篩選

    jQuery.Marquee 跑馬燈效果

    quickflip 卡片翻轉效果

    卡片翻轉效果2 相容性可以。寫的比較簡單:1,只支援x方向翻轉 2,類名都是規定好的 3,只能被呼叫一次。 需要改寫一下。我的改進版見這裡

    TheaterJS 模擬兩個人在螢幕上對話

    midnight.js 文字顏色隨著背景變,屌炸了

    color-animation jquery的顏色漸變動畫外掛。jquery的動畫不支援顏色值的變化。改庫提供了這個支援。

    transit 對元素進行css的變換

    tagcanvas 3D標籤雲效果 詳細

    iconate 圖片切換動畫

    Snap.js 左/右側導航的出現效果

    CSS shake 抖動動畫

    視覺差外掛

    scrollorama 比較簡單

    superscrollorama 能做的效果更多,但要用第三方Tween的庫,使用起來比較複雜。

    scrolldeck

    flash

    swfobj 能夠自動檢測PC、Mac機器上各種主流瀏覽器對Flash外掛的支援情況。它使得插入Flash媒體資源儘量簡捷、安全。而且它是非常符合搜尋引擎最佳化的原則的。此外,它能夠避免您的HTML、XHTML中出現object、embed等非標準標籤,從而符合更加標準。 詳細

    抽獎

    wScratchPad 刮刮卡刮獎效果

    jqueryrotate 旋轉外掛。可以用來做轉盤抽獎效果

    使用者體驗增強類

    Intro.js 用來介紹網站的功能很不錯。也可以做新手引導。

    blockUI Lolding元件。

    simple-hint 提示資訊。用css做的。相容性IE 9+。

    dotdotdot 文字溢位時,新增在文字末尾加省略號

    jQuery-menu-aim 二級選單的切換如Amazon主頁上一樣迅速

    AnythingZoomer 放大鏡功能

    美化/高亮語法程式碼

    google-code-prettify

    DlHighlight 僅支援JavaScript、CSS、XML、HTML 這4語法高亮

    please 按要求隨機舒服的顏色

    Awesomplete 輸入的智慧提示,自動補全

    proTip 提示。感覺比 Bootstrap 的 tip 好

    Hammerjs 手勢庫。封裝了 Swipe, Tap, Pinch, Pan等手勢

    動畫

    velocity 提高Jquery動畫的效能。以及顏色動畫之類的新特性。

    SVG

    Snap.svg 操作 SVG 的 JS 庫。號稱 SVG 的 jQuery。demo

    walkway 以動畫的方式,漸漸地畫出 SVG 的路徑。

    測試

    Mocha

    Chai

    Should

    Snoion

    DeviceMock.js mock 裝置。

    其他類

    ZeroClipboard 將內容複製到剪下板相容主流瀏覽器的解決方案 詳細

    html2canvas html轉化成canvas,可以用來做截圖。詳細

    Ink 響應式html郵件框架

    效能測試

    抓取,解析RSS內容(不能跨域,所以後臺要做代理,所謂的解析Rss其實就是解析xml)

    jFeed

    jRss 簡單版的jFeed

    scriptcam 與攝像頭互動

    cylon.js 機器人框架,支援35個平臺

    Masonry 一個瀑布流框架

    devices.css 移動裝置邊框的外觀。做原型的時候用不錯。

    Bootstrap相關類

    Bootbox.js 對bootstrap的彈出框做的一些封裝

    免費面板

    AdminLTE

    JS Plugins倉庫

    jQuery Cards 高質量的 jQuery 外掛網站

    jster

    node modules

    npmrank Sort npm packages by page rank

    YOU MIGHT NOT NEED JQUERY PLUGINS 不依賴 jQuery 的 js 外掛。

    awesome-nodejs

    Libraries.io 各種語言的庫

    OniUI 去哪兒網做的一套基於Avalon的框架

    常用的移動端框架

    zepto.js

    語法與jquery幾乎一樣,會jquery基本會zepto~

    最新版本已經更新到1.16

    iscroll.js

    解決頁面不支援彈性滾動,不支援fixed引起的問題~

    實現下拉重新整理,滑屏,縮放等功能~

    最新版本已經更新到5.0

    underscore.js

    筆者沒用過,不過聽說好用,推薦給大家~

    該庫提供了一整套函數語言程式設計的實用功能,但是沒有擴充套件任何JavaScript內建物件。

    最新版本已經更新到1.8.2

    滑屏框架

    適合上下滑屏、左右滑屏等滑屏切換頁面的效果

    slip.js

    iSlider.js

    fullpage.js

    swiper.js

    flex佈局

    flex佈局目前可使用在移動中,並非所有的語法都全相容,效果良好~

  • 中秋節和大豐收的關聯?
  • 13是一個什麼數啊,為什麼說它是一個不吉利的數字呢。謝謝?