Resource - JavaScript

cannon.jsベースの軽量なJavaScript製3D物理エンジン・「cannon-es」

cannon-es cannon-esはWeb用の軽量なJavaScript製3D物理エンジンです。three.jsのシンプルなAPIをインスパイアしてるそうです。 開発の止まってしまったcannon.jsをフォークし、開発継続...

スクロールに応じて任意の要素をアニメーションさせる超軽量スクリプト・「animon」

animon See the Pen RwpWBqd by kachibito (@kachibito) on CodePen. animonはスクロールに応じて任意の要素をアニメーションさせる超軽量スクリプトです。非...

任意のWebサイトにコードエディタを実装できるスクリプト・「Copenhagen Editor」

Copenhagen Editor Copenhagen Editorは任意のWebサイトにコードエディタを実装できるスクリプトです。 highlight.jsとfeather iconsが内蔵されていますが、その他のライブラリ...
Ads

軽量でカスタマイズ性の高い、非依存のウィンドウ生成ライブラリ・「WinBox.js」

WinBox.js See the Pen GRrzXoo by kachibito (@kachibito) on CodePen. WinBox.jsは軽量でカスタマイズ性の高い、非依存のウィンドウ生成ライブラリで...

チャット風のフォームを実装できるスクリプト・「chatty-form」

chatty-form chatty-formはチャット風のフォームを実装できるスクリプトです。React向けに設計されています。かなり昔にChattyというjQueryのプラグインがありましたが同じような感じのものです。 質問...

任意の要素に好みのエフェクトを付与できるシンプルなJavaScriptライブラリ・「party.js」

party.js party.jsは任意の要素に好みのエフェクトを付与できるシンプルなJavaScriptライブラリです。 導入も操作も簡単で、利用するに特に困る事も無さそうなので覚えておこうかなと思います。 以下動作サン...

映画向けに作られたオープンソースのメディアプレーヤー・「Moovie.js」

Moovie.js Moovie.jsは映画向けに作られたオープンソースのメディアプレーヤーです。映画向けとありますが基本的にはどの内容の動画でも問題なく動作します。 基本的なメディアプレーヤーの機能に加えて.vttや.srtな...

軽量で非依存のカスタマイズ可能なパーティクル生成ライブラリ・「tsParticles」

tsParticles See the Pen tsParticles - Monocromatic confetti explosions by Matteo Bruni (@matteobruni) on CodePen...

Vue.jsで作られた、パーツを組み合わせて作れるアバター作成アプリ・「Avatar Maker」

Avatar Maker Avatar MakerはVue.jsで作られた、パーツを組み合わせて作れるアバター作成アプリです。 任意の箇所から好みのパーツを選んで組み合わせてアバターを作成出来るよくあるやつです。素材やスタイルを...

仮想キーボードを実装する非依存で軽量なJavaScriptライブラリ・「Simple-keyboard」

Simple-keyboard Simple-keyboardは仮想キーボードを実装する非依存で軽量なJavaScriptライブラリです。PCのキーボードをモニターに表示してマウスでキーを選択できる、というもの。 スパイウェア対...

設定が一切不要でページロード中にプログレスバーを自動で実装してくれるスクリプト・「pace.js」

pace.js See the Pen rNWwwap by kachibito (@kachibito) on CodePen. pace.jsは設定が一切不要でページロード中にプログレスバーを自動で実装してくれるス...

シンプルなUIのモダンなwysiwygエディタを構築するためのオープンソースのツールキット・「bangle.dev」

bangle.dev bangle.devはシンプルなUIのモダンなwysiwygエディタを構築するためのオープンソースのツールキットです。 基本的にはReactで使う事を想定した設計で今後はVueもサポートする予定との事です。...

すごくシンプルで使いやすい非依存型の画像拡大鏡スクリプト・「js-image-zoom」

js-image-zoom See the Pen PobWowK by kachibito (@kachibito) on CodePen. js-image-zoomはシンプルで使いやすい非依存型の画像拡大鏡スクリ...

ダミーの画像やテキストを提供するweb components・「</placeholders>」

</placeholders> See the Pen dyOXOrR by kachibito (@kachibito) on CodePen. </placeholders>はダミーの画像や...

セキュアでシンプルなオープンソースのパスワードジェネレーター・「passwrd.in」

passwrd.in passwrd.inはセキュアでシンプルなオープンソースのパスワードジェネレーターです。Vueで書かれており、サーバーには一切データは送信されず、ブラウザのみで処理されます。 パスワードは数字や記号を含めた...

タッチデバイスにも対応した、要素を複数選択できるようにするスクリプト・「Selecto.js」

Selecto.js Selecto.jsタッチデバイスにも対応した、要素を複数選択できるようにするスクリプトです。マウスによるドラッグだけでなくスマフォ等のタッチデバイスにも対応しています。 他ライブラリに依存せずVanill...

軽量で拡張的な非依存のカルーセルライブラリ・「Tiny-Swiper」

Tiny-Swiper See the Pen VwKWMym by kachibito (@kachibito) on CodePen. Tiny-Swiperは軽量で拡張的な非依存のカルーセルライブラリです。他ライ...

カスタマイズ性の高い非依存のレスポンシブなグリッドレイアウトフレームワーク・「EasyGrid」

EasyGrid EasyGridはカスタマイズ性の高い非依存のレスポンシブなグリッドレイアウトフレームワークです。 依存性の無い軽量なJavaScrioptとCSSで様々なRWDのグリッドレイアウトを構築出来るようになっていま...

CSSのclip-pathを簡単な操作で生成できるオンラインツール・「CSS clip-path Editor」

CSS clip-path Editor See the Pen CSS clip-path Editor by Mads Stoumann (@stoumann) on CodePen. CSS clip-pat...

ブラウザでMarkdownでスライドを作成して公開できるJavaScipt製のOSS・「PRESENTA Lib」

PRESENTA Lib PRESENTA LibはブラウザでMarkdownでスライドを作成して公開できるJavaScipt製のOSSです。 1枚のファイルで作成可能で書き方もシンプルで使いやすそうです。また、Markdown...

Three.jsを使ってマネキンに任意のポーズで表現できるスクリプト・「mannequin.js」

mannequin.js See the Pen rNMLqKv by kachibito (@kachibito) on CodePen. mannequin.jsはThree.jsを使って3Dマネキンに任意のポーズ...

Reactベースのシンプルでタッチフレンドリーな日付ピッカー・「React Nice Dates」

React Nice Dates React Nice DatesはReactベースのシンプルでタッチフレンドリーな日付ピッカーです。 タッチデバイスで指でタップしやすいように日付同士は間隔をあけられていたり、上下にドラッグする...
Ads