Resource - JavaScript

段落に直接コメントできる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...
Ads

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

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

利用されているWebフォント名と、そのフォントの表示テストを行えるブックマークレット・「Type Sample」

Type Sample Type SampleはWebサイトの各エレメントで設定されているWebフォントの名前と、そのフォントを任意のテキストで表示テスト出来るブックマークレットです。任意のWebサイトで起動すると、各要素にカーソルを...

デスクトップ/モバイル向けのHTML5製ゲームフレームワーク・「Phaser」

Phaser Phaserはモバイル/デスクトップ向けのHTML5製の2Dゲームフレームワークです。pixi.jsを使うことでCanvasやWebGLのレンダリングもサポート可能との事。大量の動作サンプルが用意されていますのでご興味の...

複数のチャートを連動させる多次元チャートライブラリ・「dc.js」

dc.js dc.jsは複数のチャートを連動させる多次元チャートライブラリです。例えば円グラフの任意の場所をクリックすると、他のグラフがその箇所に応じたデータに変化します。デモをご確認頂いたほうが早いかもしれません。複雑なデータの可視...

多数のコンポーネントが備わったCSSフレームワーク・「Maxmertkit」

Maxmertkit Maxmertkitはタイポグラフィやテーブル、ボタンやタブなどなどWebサイトに必要なコンポーネントを大量に備えたCSSデザインフレームワークです。RWDにも対応しています。Bootstrapのような使い方が出...

難読化されたJavaScriptコードを見やすく整形する・「JS NICE」

JS NICE JS NICEは難読化されたコードを読みやすく整形するツールです。ただ整形するだけでなく、ローカル変数の名前を変更する事も可能みたい。沢山のOSSから規則性を学習したプログラム解析技術を利用しており、適切な変数名を提案...

大量のデータもフィルタリング可能なデータテーブルを実装するjQueryプラグイン・「jQuery DataTables」

jQuery DataTables jQuery DataTablesは大量のデータも高速でフィルタリングしてくれるデータテーブルを実装するスクリプトです。jQueryに依存しています。動作デモでは、10万以上あるデータから瞬時にフィ...

モバイル/デスクトップWebアプリ向けのリッチなUIを構築できるJavaScriptフレームワーク・「Webix」

Webix WebixはJavaScript、CSS、HTML5を使用した、インタラクティブなWebアプリケーションを構築するためのUIフレームワークです。クロスブラウザ、クロスデバイスとの事ですが、どれくらい対応しているかはちょっと...

クリッカブルな日本地図を実装するjQueryプラグイン・「Japan Map」

Japan Map Japan Mapは日本のクリッカブルマップを実装できるスクリプトです。都道府県だけでなく、地域でグループ化も出来るみたい。これは覚えておくと良さそうです。ライセンスはMITとの事。 Japan Map

個人向けデータ管理システムを構築できるオープンソースのソフトウェア・「TagSpaces」

TagSpaces TagSpacesはOSSのデータ管理システムです。個人向けのシステムとして作っているみたいですね。デモが見当たりませんが、SSを見る限りでは結構便利かも。制作業に限らず応用できそうです。暇を見て触って見たい。ライ...

Bootstrap向けのレスポンシブなメガメニューを実装する・「Responsive Bootstrap MegaMenu」

Responsive Bootstrap MegaMenu Responsive Bootstrap MegaMenuはBootstrap向けのRWDに対応対応したメガメニューです。ドロップダウンメニューの中には動画やGoogleマッ...

スマフォ向けWebアプリの為のシンプルなコンポーネント集・「Ratchet」

Ratchet Ratchetはスマフォ向けWebアプリの為のシンプルなコンポーネント集です。Bootstrapと同じ開発元で公開されていました。スマフォ専用のBootstrapなのかもしれないですね。基本的なものは一通り揃っています...

jsfiddleライクにブラウザ上でJavaScriptの動作テストができるオープンソースのソフトウェア・「Codemagic」

Codemagic Codemagicはブラウザ上でJavaScriptの開発・動作テストを行えるツールです。jsfiddleと同じようなものですが、こちらはOSSとしてGithubにてソースが公開されています。ライセンスはMITとの...

OSSとして公開されている、正規表現の動作テストをブラウザ上で行えるツール・「RegExr」

RegExr RegExrはブラウザ上で正規表現のテストができるツールです。GithubにてOSSとしてもソースが公開されています。refiddleとほぼ同じ性能になりますが、RegExrの方が個人的には若干使いやすい印象でした。ライ...

単一ページで作るHTML5製Webアプリ向けのフレームワーク・「BladeRunnerJS」

BladeRunnerJS BladeRunnerJSは単一ページで構築するHTML5製のWebアプリ向けに作られたOSSの開発フレームワークです。大規模で複雑なWebアプリに対応できるのが強みみたいですね。ライセンスはGPLとな...

WebベースのiOS7アプリ向けHTMLフレームワーク・「Framework7」

Framework7 Framework7はWebベースのiOS7アプリ向けに開発されたHTMLフレームワークです。iOS7のようなフラットなデザインで各UIコンポーネントもiOS7を意識した作りとなっています。ライセンスはMITとの...

AngularJS対応のHTML5製モバイルWebアプリ向けのフレームワーク・「Ionic」

Ionic IonicはOSSとして公開されているAngularJS対応のHTML5なモバイルWebアプリ用フレームワークです。Sassベースで構築されています。jQueryに依存しないのは個人的に有りがたいです。ライセンスはMITと...

アイソメトリックを利用したピクセルアートをcanvasで描く為のライブラリ・「Obelisk.js」

Obelisk.js Obelisk.jsはアイソメトリック(等角投影法)を利用したピクセルアートをHTML5 canvasで描くためのライブラリです。上記のようにGifアニメーションの作成も可能です。アイデア次第では面白いコンテンツ...

jsFiddleのようにブラウザでJavaScriptを書いて動作を確認出来るOSS・「tmpltr」

tmpltr tmpltrはOSSで公開されているjsFiddleライクな開発ツールです。ブラウザ上でJavaScriptを開発、実行テストができます。完全なクローンではありませんが、JavaScriptとHTMLで作られている為、軽...
Ads