Tutorialzine 是一個教程資源網站,每月都會發布一些優秀資源,以讓讀者瞭解最新最酷的網路開發趨勢,本月同樣精心挑選了 15 個 JavaScript 和 CSS 供大家參考學習。
Propeller
Propeller 是一個基於 Bootstrap 和 Google’s Material Design 語言的 CSS 元件框架。它包含 25 個元件,響應敏捷,具有典型 Material Design 動畫的特點。該專案可以作為 Bootstrap 主題下載,也可作為完整的框架或獨立的元件下載。
BaguetteBox
baguetteBox.js 是一個簡單簡單、易用的 JavaScript lightbox庫,它具有一下特點:
- 純 JavaScript 實現,無需依賴其他庫
- 支援觸控式螢幕裝置手勢操作
- 支援顯示標題(說明)
- 支援響應式影像
- 支援CSS3過渡
- 使用 SVG 按鈕,沒有多餘的檔案下載
- 啟用 gzip 壓縮後僅 2KB
Whitestorm
Whitestorm 使用 Three.js 引擎開發 3D 網頁應用和遊戲,它為普通的 Three.js 任務提供封裝,使搭建環境,建立物件,新增物件等操作更簡單。官方提供了很好的專案教程,以及與 React 整合的工具。
Animatelo
Animatelo 是極度流行的 Animate.css 庫的埠,它用 Web Animations API 克隆代替 CSS 轉換。所有原始的 Animate.css 效果都被重建,但現在的 API 是基於 JavaScript 類而不是 CSS 類。該庫輕量且不依賴 jQuery,但在舊版瀏覽器要求 polyfill。
FuseBox
FuseBox 是一個用於 JavaScript 和 CSS 的捆綁載入器,帶有 TypeScript,Sass 等可選的附加元件。它以簡潔與效能為主,為 webpack 提供替代方案。相關教程:Angular 2 + TypeScript, React + Babel, Vue.js, Electron 等。
Yargs
Yargs 框架通過使用 Node.js 構建功能全面的命令列應用,它能輕鬆配置命令,解析多個引數,並設定快捷方式等,還能自動生成幫助選單。
WebGradients
WebGradients 含有多種漂亮的漸變色,可在任何 HTML 頁面輕鬆應用。你可在專案網站快速預覽可用的漸變色,還能一鍵複製 CSS 到你的專案中去。
Sticky-Kit
Sticky-kit 是一個 jQuery 外掛,它允許你在頁面附加元素,設定跟隨滾動的側邊欄效果。
ScrollDir
ScrollDir 是一個超輕量無依賴的 JavaScript 庫,用以檢查滾動條的移動,並根據你的選擇元素切換 上/下 資料屬性。該專案能給你帶來平滑的使用者體驗。
Svgo
用以優化 SVG 檔案的 Node.js 工具,它將它們從非必要的資訊中剝離出來,如,編輯器後設資料,註釋,隱藏元素等。SVGO 具有基於外掛的架構,你可自由選擇需要刪除和保留的內容。
Store.js
Store.js 是一個跨瀏覽器的用於高階本地儲存的解決方案,它實現了瀏覽器的本地儲存的 JavaScript 封裝 API,不是通過 Cookie 和 Flash 技術實現,而是使用 localStorage、globalStorage 和 userData 行為。
Snarkdown
Snarkdown 是一個用 JavaScript 編寫的極簡的 Markdown 解析器。它不是功能最全的,但可能是最容易實現的一款解析器。Snarkdown 只有 1Kb 大小,且只有一種方法,適合速成專案。
Unfetch
Fetch API 能讓開發者更好地處理非同步請求,它能在大多數瀏覽器上受支援,但 fetch() 方法在 IE 瀏覽器中仍不可用。
Scrollanim
Scrollanim 是使用 CSS3 + JavaScript 實現的用於建立滾動動畫的庫,應用到元素上後,當此元素出現在瀏覽器可視區域時便會執行對應的動畫。Scrollanim 是 Kissui 的一部分,所以使用 Scrollanim 時需要用到 kissui.css。
Neurojs
用於在瀏覽器中進行深度學習 JavaScript 框架,可以通過強化學習進行全棧神經網路。演示:Demo app