スクロールに応じて任意のCSSアニメーションを要素に付与するスクリプト・「Delighters.JS」 Delighters.JS Delighters.JSはページスクロールに応じて要素に任意のCSSアニメーションを付与できるスクリプトです。よく見かけるやつです。個人的には多くの場合、嫌でも目にしっかり入ってくるくらいの派手なエフェク...2018.03.11 | 10時28分36秒
Bootstrap 4向けのオープンソースなダッシュボード用テンプレート・「Now UI Dashboard」 Now UI Dashboard Now UI DashboardはBootstrap 4向けのOSSなダッシュボード用テンプレートです。目に優しいカラースキーム、見やすいUI等を意識して作られたそうです。OSSですが、有償プランも用...2018.02.27 | 11時05分53秒
マルチレベルに対応したドリルダウンのハンバーガーメニューを実装できるスクリプト・「mlStackNav」 mlStackNav mlStackNavはマルチレベルに対応したハンバーガーメニューです。jQueryに依存します。ドリルダウンでマルチレベルナビゲーションに対応していますので省スペースに大量のナビゲーションを詰め込むことができます...2018.02.24 | 12時20分15秒
解析機能も付いたオープンソースの短縮URLツール・「Kutt」 Kutt Kuttは解析機能も付いたOSSのURL短縮ツールです。短縮されたURLの管理と解析が可能で、パスワード付きでの発行も出来るようです。p.tlやtr.imのように、いつサービスが終了するか分からない、終了したらデッドリンクと...2018.02.19 | 10時47分24秒
CSS変数を利用したパララックスエフェクトをサポートするライブラリ・「basicScroll」 basicScroll See the Pen basicScroll Default Demo by Tobias Reich (@electerious) on CodePen. basicScrollはCSS変数を利用して...2018.02.16 | 11時17分09秒
項目数が多くなったリストやテーブルを自動で複数ページに分割し、ページネーションを加えるスクリプト・「paginathing.js」 paginathing.js paginathing.jsは長くなったリストやテーブルを複数ページに分割するスクリプトです。jQueryに依存します。ページネーションも自動で付与します。オプションで1ページに表示するアイテム数やリ...2018.02.13 | 10時42分45秒
開発者向けのツールやリソースのリストをコレクションしている・「Pretty Awesome Lists」 Pretty Awesome Lists Pretty Awesome Listsは開発者向けのツールやリソースのリストをコレクションしているプロジェクトサイトです。開発者といっても様々ですが、Pretty Awesome Lists...2018.02.12 | 11時16分27秒
旧Windowsのペイントツールを再現したWebベースのペイントアプリ・「JS Paint」 JS Paint JS Paintは旧WindowsのペイントツールのUIを再現したペイントアプリです。95~XP時代のものだったと思いますが違ったらごめんなさい。特に何か大きな目的があったりプロジェクトだったりというわけではなく、単...2018.01.30 | 10時46分08秒
カンバンツールを作成する為のスクリプト・「jKanban」 jKanban See the Pen jKanban - Javascript plugin for Kanban boards by kachibito (@kachibito) on CodePen. ※ドラッグ&ドロップが動...2018.01.15 | 10時22分17秒
沢山のコンポーネントを持ったVue.js向けのUIツールキット・「Fish-UI」 Fish-UI Fish-UIはVue.js向けのUIコンポーネント集です。グリッドやボタン、メニュ-、ポップアップ、フォームなどの基本的なUIやカレンダー、日付ピッカー、時間ピッカー、タイムラインなどのコンポーネントも備えられていま...2018.01.14 | 10時52分18秒
スクロールに応じて指定した要素に任意のclassを付与できるスクリプト・「scrollClass」 scrollClass scrollClassはスクロールの挙動に応じて任意の要素にclassを付与するためのスクリプトです。jQueryに依存しています。上に動作サンプルを用意しました。初期は文字が赤、下にスクロールすると途中で...2018.01.12 | 10時06分53秒
30秒で理解できるものだけを集めたJavaScriptコードスニペット集・「30 seconds of code」 30 seconds of code 30 seconds of codeは「30秒で理解できるJavaScriptコード」をまとめたスニペット集です。理解力に欠ける自分の脳では30秒は難しかったですが、シンプルながら便利そうなコード...2018.01.04 | 10時03分35秒
インライン用のオープンソース国産WYSIWYGエディタ・「Lite Editor」 Lite Editor See the Pen Lite Editor - demo by appleple (@appleple) on CodePen. Lite Editorはインライン要素に特化したオープンソース国産WY...2017.12.30 | 10時38分53秒
オープンソースのファイルアップローダー・「Uppy」 Uppy UppyはOSSとして公開されているファイルアップローダーです。Googleドライブ、Dropbox、Instagram等との併用が可能で多言語にも対応しています。デフォルトのUIではリネームやキャプションの設定、ライセンス...2017.12.28 | 10時07分34秒
ドラッグ&ドロップにも対応の、JavaScript製タイムスケジューラー・「jq.schedule.js」 jq.Schedule jq.ScheduleはJS製のタイムスケジューラーです。jquery及びjquery UIが必要です。日本の方が作成されています。タスク管理系のアプリや従業員のシフト管理ツールなど、利用幅は多々ありそうですね...2017.12.26 | 10時18分00秒
ウェブアクセシビリティを重視した使いやすいモーダルウィンドウ・「Modaal」 Modaal Modaalはウェブアクセシビリティを重視した使いやすいモーダルウィンドウです。WCAG 2.0の達成基準レベルAAをクリアしているそうで、全ての人にとってアクセスブルであると謳っています。jQuery依存っぽいのでこの...2017.12.25 | 10時27分29秒
複数プレイリストもサポートしたOSSな非依存型オーディオプレイヤー実装スクリプト・「AmplitudeJS」 AmplitudeJS AmplitudeJSは複数プレイリスト等もサポートした非依存のHTML5オーディオプレーヤーを実装できるスクリプトです。コントローラーも直感的でわかりやすくタッチデバイスフレンドリーな設計となっているそうです...2017.12.10 | 10時02分21秒
カーソルを乗せた方向によって変化するマウスホバーエフェクトを実装するライブラリ・「Direction Reveal」 Direction Reveal Direction Revealはカーソルの入った方向を検出してエフェクトを変化させるライブラリです。他ライブラリに依存せず単体で動作します。たまにどこかしらで見かけるやつを手軽に実装できる的なもの。...2017.12.06 | 10時16分37秒
Web用リッチテキストエディタを作成する為のツールキット・「ProseMirror」 ProseMirror ProseMirrorはWeb用リッチテキストエディタを構築するためのツールキットです。以前はMarkdown⇔HTMLなWYSIWYGエディタだったようですが、現在は様々な形のリッチテキストエディタを作るため...2017.12.05 | 10時03分27秒
スクロールが生じたtableの左右上下の列や行などを固定出来るスクリプト・「TableHeadFixer」 TableHeadFixer TableHeadFixerはtableのヘッダーやフッター、左や右の列を固定できるスクリプトです。jQueryに依存します。スクロールが生じたtableで重要な個所を固定する事でユーザーのスクロール頻度...2017.12.01 | 11時51分37秒
シンプルなオートコンプリート実装スクリプト・「LightAutocomplete.js」 LightAutocomplete.js LightAutocomplete.jsはシンプルな自動補完機能実装スクリプトです。jQueryに依存します。非常にシンプルで、名前にもあるように軽量さを特徴としています。使い方も簡単で、スク...2017.11.28 | 10時09分33秒
inputで指定したパターン以外の入力を不可にするバニラなJavaScriptライブラリ・「imaskjs」 imaskjs imaskjsはinput入力の際、指定したパターン以外の入力を不可にするライブラリです。非依存型のバニラなスクリプトで他ライブラリを必要としません。また、必要な機能を追加するモジュール式となっているっぽいです。typ...2017.11.26 | 11時07分16秒