Resource - JavaScript

Webサイトの様々なヘルプコンテンツを追加出来るスクリプト・「FAQtoid」

FAQtoid FAQtoidはWebサイトに様々なヘルプ機能を追加するためのスクリプトです。jQueryに依存しています。動画や開閉式のFAQ、送信フォームやWebサイトツアーを、モーダルウィンドウ内に複数収めることが可能で、モーダ...

ビジネス用Webアプリ構築の為のCSSフレームワーク・「Flakes」

Flakes Flakesはビジネス用のWebアプリ構築の為に公開されたCSS/JavaScriptフレームワークです。RWDやSASSにも対応済み。ダッシュボードに必要なUIやチェックボックス、フィルタ機能付きのテーブルなどのコンポ...

SVGアイコンをアニメーションエフェクト付きで切り替える為のスクリプト・「SVG Morpheus」

SVG Morpheus SVG MorpheusはSVGアイコンから別のSVGアイコンへモーフィングさせる為のスクリプトです。非依存型で単体で動作してくれます。導入も楽そう。オプションやらサポートされたイージングの種類は本サイトにて...
Ads

正規表現のコードを図に可視化する・「Regulex」

Regulex Regulexは書いた正規表現のコードを図に可視化してくれるツールです。書いたコードがどのように動作しているかが把握しやすいので正規表現の勉強に良いかも。MITライセンスの元でオープンソースとしてGithubでも公開さ...

行単位でCSSを適応させるスクリプト・「LINING.JS」

LINING.JS LINING.JSは行単位でCSSを適応させる為のスクリプトです。非依存型で単体で動作してくれます。カスタムデータ属性を使って1行毎に任意のスタイルを作れる、みたいなやつ。上記のスクショは表示時に、1行毎にスライド...

マテリアルデザインを取り入れたレスポンシブWebデザイン対応のCSSフレームワーク・「Materialize」

Materialize Materializeはマテリアルデザインを取り入れたRWD対応のCSSをフレームワークです。Sass対応で、各種コンポーネントも揃っていました。ベーシックで良いんじゃないでしょうか。ライセンスはMITとの事。...

モバイルやモダンブラウザ向けに、jQueryやzepto.jsの代替として作られた軽量ライブラリ・「laroux.js」

laroux.js laroux.jsはモバイルやモダンブラウザ向けに作られたjQuery、zepto.jsの代替ライブラリです。コアは非圧縮でも2.8kbと軽量で、Ajaxやアニメーション、データの取得等、やりたい事があればその都度...

デバイス間のフォーム要素のスタイルに差異が出ないようにする為のライブラリ・「Formplate」

Formplate Formplateは異なるデバイスでもフォームの見栄えに差異が生じないようにする為のライブラリです。jqueryとmodernizrに依存しているみたい。スタイルを均一にしたい要素を指定されたclassで包括する必...

OSSとしても公開されている、絵文字を使うためのライブラリ・「Emoji One」

Emoji One Emoji Oneはオープンソースとしても公開されている絵文字用ライブラリです。絵文字そのものの素材も配布されています。ダウンロードして利用する事も、CDNを利用して導入する事も出来るみたいですね。jsdelivr...

GoogleスプレッドシートをWebサイトに埋め込む為のツール・「Brace Data」

Brace Data Brace DataはGoogleスプレッドシートのデータを任意のWebサイトに埋め込むためのWebサービスです。埋め込みたいスプレッドシートのURLを入力すると、認証を求められるので許可すればJavaScrip...

AngularJSとBootstrapを使ったシンプルなRWD対応のダッシュボードのテンプレート・「Responsive Dashboard」

Responsive Dashboard Responsive DashboardはAngularJSとBootstrapを使ったシンプルなデザインの管理画面のテンプレートです。レスポンシブWebデザインに対応しています。WordPr...

フリーで公開されている、パワフルなベクターデザインアプリ・「GRAVIT」

GRAVIT GRAVITはパワフルで先進的なベクターデザインアプリです。現在デスクトップアプリだけでなく、ブラウザ版が無料公開されています。なかなかの機能性という印象です。ぱっと見、個人的には苦手なUIでしたが、見た目より扱いやすそ...

ブラウザでスプレッドシートを共同作成出来るオープンソースのソフトウェア・「EtherCalc」

EtherCalc EtherCalcはブラウザでスプレッドシートを複数人で共同作成出来るツールです。OSSとしても公開されています。LiveScriptが使われています。ライセンスはあまり聞き慣れませんが、CPALというライセンスで...

ゲームアプリ開発に役立つリソースを大量にまとめた・「Magic Tools」

Magic Tools Magic Toolsはゲームアプリ開発に役立ちそうなリソースを大量にまとめたWebサイトです。ゲーム用のマップエディタや3Dモデリングツール、ゲームエンジンやフレームワーク、音源リソースなどなどゲーム開発で必...

フロントエンド開発の為のコンポーネント集・「FORMSTONE」

FORMSTONE FORMSTONEはフロントエンド開発のためのコンポーネントを集約しているWebサイトです。RWD対応のCSSグリッドシステムやドラッグ&ドロップで出来るアップローダー、モーダルウィンドウ、カルーセルなど様々なコン...

Web Audioの制御やOSCデータの送信が可能なオーディオUI向けJavaScriptライブラリ・「NexusUI」

NexusUI NexusUIはWeb Audioの制御や他アプリケーションへのOSCデータの送信等が可能な、Webブラウザ向けのオーディオUIを設計する為のJSライブラリです。モバイルフレンドリーに作られているとの事です。名前はこん...

Androidライクなパターンロックを実装するスクリプト・「Pattern Lock」

Pattern Lock Pattern LockはAndroidのようにパターンでロックを掛ける為のスクリプトです。jQueryに依存します。上記のようにcaptchaの通りなぞる事でロックが解除される、といった、スパム対策も可能で...

CSVのパースとエンコードが可能なスクリプト・「CSV.js」

CSV.js CSV.jsはCSVのパースとエンコードが可能なスクリプトです。CSVの仕様に準拠しているとの事です。シンプルで使い勝手良さそうですね。ライセンスはMITです。 CSV.js

段落に直接コメントできるMediumスタイルを実装出来るスクリプト・「SideComments.js」

SideComments.js SideComments.jsはMediumのように、段落毎にコメントできるスタイルを導入できるスクリプトです。jQueryに依存しています。従来のコメントエリアは基本的に最下部にあるでしょうし、長文の...

地図と連動したインタラクティブなストーリーコンテンツを作成出来る・「ODYSSEY」

ODYSSEY ODYSSEYは地図と連動したインタラクティブなストーリーコンテンツを作成できるツールです。形式を選択し、マップの位置やzoom、マーカ等を設定していくだけ。作成後はソースのダウンロードや、提供して貰えるコードでWeb...

tableのデータを様々なフォーマットでエクスポート出来る様にするスクリプト・「HTML Table Export」

HTML Table Export HTML Table Exportはtableに書いたデータを様々なフォーマットでエクスポート出来るようにするスクリプトです。jQueryに依存します。対応フォーマットはPDFやJSON、PNG、X...

input要素のラベルにアニメーションエフェクトを追加するスクリプト・「FancyText」

FancyText FancyTextはformのinput要素に指定したラベルテキストにアニメーションエフェクトを追加するスクリプトです。jqueryに依存しています。フォーカスすると、ラベルが入力の邪魔にならないように外に出たり非...
Ads