Resource - JavaScript

データを可視化する為のグラフ描画JavaScriptライブラリをまとめた・「JSGraphs」

JSGraphs JSGraphsはデータ可視化の為のJSライブラリをまとめているWebサイトです。左カラムの各項目でライブラリをJquery依存のもの、無償利用可能なもの、SVGを使ったもの等に絞ることが可能です。SSにマウスホバー...

レスポンシブWebデザインに対応している各CSSフレームワークや人気のライブラリの動作テストを手軽に行える・「Codeply」

Codeply CodeplyはBootstrapやFoundationなどのRWDに対応したフレームワークをベースに、jQueryやBackbone.js、Underscore.js、Angular.jsなどのライブラリの動作テスト...

軽量なWYSIWYGエディタを実装する為のjQueryプラグイン・「Trumbowyg」

Trumbowyg TrumbowygはjQuery依存のWYSIWYGエディタです。軽量且つ高速な動作を目指したそうです。HTML5もサポートされており、カスタマイズ性にも優れているようですね。他言語化もされており、日本の有志が本プ...
Ads

画像にウォーターマークを付与出来るスクリプト・「watermark.js」

watermark.js watermark.jsは画像にウォーターマーク(透かし)を付与出来るスクリプトです。画像の上にCSS等でレイヤーを重ねるのではなく、指定した画像に直接任意の画像やテキストを透かしとして加え、データURIスキ...

大量のjQueryプラグインと、その使い方等をコレクションしている・「jQueryScript.Net」

jQueryScript.Net jQueryScript.NetはjQueryのプラグインをコレクションしているWebサイトです。プラグインだけでなく、その使用方法やライセンス、ファイルサイズ等を簡単に紹介しています。今更感が否めな...

モバイルファーストな軽量フロントエンドフレームワーク・「Wee」

Wee Weeは軽量でモバイルファーストなOSSのフロントエンドフレームワークです。軽量ではあるものの、その性能は非常に充実しており、フレームワークとしてしっかり機能してくれそうな印象でした。開発をサポートするJavaScriptツー...

書いたテキストに背景画像を適応させるスクリプト・「TextHoler.js」

TextHoler.js TextHoler.jsは書いたテキストに上記のように背景画像を適応させる為のスクリプトです。jQueryに依存しています。指定された要素にCSSを加えるだけのシンプルなものなので手軽でいいですね。とは言え、...

Canvasベースのグラフを描けるjQueryスクリプト・「Flot」

Flot FlotはCanvasを使ったチャートを実装する為のライブラリです。jQueryに依存しています。上図のようなシンプルなグラフに限らず様々なビジュアルのグラフに対応することが可能です。グラフのリアルタイムアップデートにも対応...

SASSで構築された軽量なフロントエンド開発フレームワーク・「Penguin」

Penguin PenguinはSASSで構築されたフロントエンド開発の為の軽量スターターキットです。OSSとして公開されています。必要最低限のコンポーネントも揃えられており、RequireJS併用でモジュールの管理も可能との事。個人...

CSVをパースする為のスクリプト・「Papa Parse」

Papa Parse Papa ParseはCSVをパースするためのJavaScriptです。大きなファイルサイズにも対応可能でCSV⇔JSONでコンバートしてくれます。他、ローカルファイルを開ける、区切り文字の自動検出等が特徴として...

HTML5ベースのノベルゲームを実装出来る国産ゲームエンジン・「O₂ Engine」

O₂ Engine O₂ EngineはHTML5ベースのノベルゲームエンジンです。HTML5なのでブラウザはまだ選ぶものの、デバイスを気にせず作れるのは素敵ですね。本ゲームエンジン開発者が提供するノベルゲームサービスのノベルスフィア...

動画のように表現出来るコンテンツスライダー・「Jquery Image Player」

Jquery Image Player Jquery Image Playerはコンテンツを動画のように再生して連続表示出来るJSスライダーです。jQueryに依存しています。上図のように、HTMLで書かれたテキストや画像等が含まれた...

ブラウザで動くシンセサイザーを実装する為のスクリプト・「beep.js」

beep.js beep.jsはブラウザ上で動く、WebAudio APIを使ったシンセサイザー構築の為のJavaScriptフレームワークです。シンプルなコードで動かせるように作ったそうです。デモページではコンソールを開いてtext...

jPlayerとBootstrap併用でiTunes検索を実装する為のスクリプト・「iTunes Search」

iTunes Search iTunes SearchはjPlayerとBootstrap併用で、その場で視聴可能なiTunes検索を実装する為のスクリプトです。jQueryに依存しています。検索はSearch APIからjsonでデ...

Webサイトのスタイルをユーザーがデスクトップ向けとモバイル向けに切り替えられるようにするスクリプト・「Responsible.js」

Responsible.js Responsible.jsはWebサイトのスタイルをPC⇔モバイルでスイッチ出来るようにするスクリプトです。他ライブラリに依存せず、単体で動いてくれます。前提条件として、Media Queriesを使用...

FoundationやBootstrapを使用しているWebサイト上にグリッドを表示するブックマークレット・「Grid displayer」

Grid displayer Grid displayerはFoundationやBootstrapといった人気のフレームワークを使用したWebサイト上にグリッドを表示させるブックマークレットです。単純にグリッドを表示させるだけでなく...

tableに書いたデータをGoogle Chartを使ってグラフ化する為のスクリプト・「Chartinator」

Chartinator Chartinatorはtableに書いたデータをGoogle Chartでグラフ化する為のスクリプトです。jQueryに依存しています。既存のtable要素に書かれたデータを可視化出来るのでユーザビリティの改...

WebGL用のOSSな3Dゲームエンジン・「PlayCanvas 」

PlayCanvas PlayCanvasはオープンソースとして公開されているWebGL用の3Dゲームエンジンです。Windows、OS X、AndroidやiOSなどに対応したクロスプラットフォームなゲーム制作をサポートするとの事...

YoutubeやImgur、Githubリポジトリ、jsFiddle等のURLをリッチメディアに変換するライブラリ・「Olly.js」

Olly.js Olly.jsは様々なサービスのコンテンツのURLをリッチメディアにコンバートするライブラリです。サポートしているサービスはYoutube、Vimeo、TEDなどの動画サービスやImgurなどのアップローダー、Twit...

SVGによるシンプルなパターン背景を作るためのライブラリ・「Textures.js」

Textures.js Textures.jsはSVGで線や点を使ったシンプルなパターン背景を作るためのライブラリです。d3.jsを使ってビジュアライズされたデータの背景を作るために設計された様です。点はtextures.circle...

jQueryを使った100のテクニックとサンプルコードを一括配布している・「jQuery Trickshots」

jQuery Trickshots jQuery TrickshotsはjQueryを使った100のテクニックとそのサンプルを配布するプロジェクトです。週1で届くTutorialzineのニュースレターを購読する事でダウンロード出来る...

WebGLを使って画像にエフェクトを与える為のJavaScriptライブラリ・「glfx.js」

glfx.js glfx.jsはWebGLを使用して画像を編集出来るようにする為のJSライブラリです。セピア加工やチルトシフト、ボケ、ノイズ効果などのエフェクトを与えることが出来ます。WebGLなので対応ブラウザが限られる為、すぐに実...
Ads