モダンブラウザ向けのjQuery代替な軽量スクリプト・「cash」
cash cashはモダンブラウザ向けのjQuery代替スクリプトです。と言っても100％代替を目指すつもりは無いようで、あくまで軽量さを保ちつつ、ある程度jQueryで出来ることをカバーしていく、というもののようですね。cashのコ...
Resource - フレームワーク
CSSのフィルターを手軽に扱えるようにするスクリプト・「Philter」
Philter PhilterはCSSのfilterを手軽にコントロールできるようにする為のスクリプトです。jQuery版とvanilla.JS版があります。CSSを書かずとも、例えばdata-philter-grayscale="1...
Githubで公開されているjQueryのプラグインと詳細をまとめている・「jQuery Cards」
jQuery Cards jQuery CardsはGithubで公開されているjQueryのプラグインと詳細をまとめているWebサイトです。詳細はREADME.md等を引っ張ってきてるみたいです。また、全てではありませんが、動作デモ...
シングルページのWebアプリケーションエンジン・「Senna.js」
Senna.js Senna.jsはオープンソースのシングルページなWebアプリケーションエンジンです。軽量で他ライブラリに依存しないフレームワークとなっており、高速ブラウジング可能なWebアプリ構築をサポートしてくれるとの事。ライセ...
ブレンドモードを利用したカラフルなフィルタの為のCSS・「Colofilter.css」
Colofilter.css Colofilter.cssはcssのblend modesを使用したカラフルなフィルタの為のCSSです。mix-blend-modeプロパティを予め設定し、classでフィルタをかけられるようにしたCS...
CSSで変更できるカーソルとコードの一覧・「CSS Cursor」
CSS Cursor CSS CursorはCSSで変更できるカーソルとそのプロパティ、対応ブラウザの一覧ページです。思いの外しらないものもあったので備忘録的に。HTML製のWebアプリも増えているので以前よりも需要は高くなっているか...
WebベースなAirDropのオープンソースクローン・「Snapdrop」
Snapdrop SnapdropはAppleのAirDropクローンです。オープンソースとして公開されています。HTML5製のWebベースとなっており、ブラウザを利用して異なるデバイス間でのファイル転送が可能との事。ブラウザは同じも...
gistやYoutube、Vine、TwitterやGoogle Mapなど、様々なサービスをembed出来る・「embed.js」
embed.js embed.jsは様々なサービスの埋め込みを容易に行えるようにする為のスクリプトです。テキストから自動で文字列を解析し、embedしてくれる、というもの。例えばGistやYoutubeなら、URLを貼るだけで勝手に埋...
Flexboxのルールをライブプレビューでテスト、確認出来る・「Test CSS Flexbox Rules Live」
Test CSS Flexbox Rules Live Test CSS Flexbox Rules LiveはFlexboxのルールを学べるツールです。各プロパティの指示でどうレイアウトが変化するかをライブプレビューで確認出来ますの...
ブラウザ上で数式を高速且つ手軽に表示する為のJSライブラリ・「KaTeX」
KaTeX KaTeXはWeb上で数式を高速簡単に表示する為のスクリプトです。上図のような、Web上で表示するのが難しい数式を手軽に書けるようにしよう、みたいなやつ。既存のMathJaxよりも高速との事で、比較画像も用意されています。...
ブラウザでPDFを作成するスクリプト・「pdfmake」
pdfmake pdfmakeはブラウザ上でPDFを作成する為の非依存型スクリプトです。JSONライクな記法で作成出来るみたいです。が、例によってこのままだと日本語は読み取ってくれませんので対応が必要になります。コードテストできるので...
ページのスクロール時にviewport内に入った要素をアニメーション表示させる非依存型で軽量なスクリプト・「ScrollReveal」
ScrollReveal ScrollRevealはページのスクロール時に、viewport内に入った要素をアニメーションエフェクト付きで表示するためのスクリプトです。他ライブラリへの依存は無く、単体で動作してくれます。圧縮版で2.7...
JavaScriptで作られたSVG背景パターン作成ツール・「Dynamic SVG Background Pattern Maker」
Dynamic SVG Background Pattern Maker See the Pen Dynamic SVG Background Pattern Maker by Dudley Storey (@dudleystorey) ...
Webページ内の任意のテキストをハイライト、タグ付け、共有出来るようにするスクリプト・「Annotator」
Annotator AnnotatorはWebページ内の任意のテキストをハイライト、タグ付け、メモと共有可能にするスクリプトです。動作にはjQueryを、オプションとして自動補完にawesomplete.jsを必要としています。テキス...
非依存型のシンプルな通知ライブラリ・「notie.js」
notie.js notie.jsは他ライブラリに依存しないシンプルでクリーンな通知ライブラリです。WarningやError、Confirm等の通知を、他ライブラリに依存する事無く実装出来ます。セッティングも簡単でなかなか使いやすそ...
モバイルフレンドリーなWebサイト制作の為のFoundationベースのWordPressフレームワーク・「JointsWP」
JointsWP JointsWPはFoundationベースのWordPressテーマフレームワークです。Foundationは現時点で最新のVer.6をベースとしています。モバイルフレンドリーでフレキシブルなWebプロジェクトに貢...
モバイル対応なWebプロジェクトの為のフロントエンドフレームワーク・「SCHEMA」
SCHEMA SCHEMAはモバイル対応なWebプロジェクトの為のフロントエンドフレームワークです。Bootstrap、Less、Angular.js等が使われているようです。Web標準を放棄することの無いセマンティクス且つ迅速な設計...
任意の画像からよさ気な部分を自動で切り取るスクリプト・「smartcrop.js」
smartcrop.js smartcrop.jsは任意の画像からよさ気な部分を自動で切り取るスクリプト。訳わからんですね。まともな説明が思いつきませんでしたすみません。指定されたサイズの範疇で、画像からさも良さそうに見える構図で自動...
任意のライブラリを読み込んでデベロッパーツールのコンソールからテストできる・「JS Envy」
JS Envy JS Envyは任意のライブラリをロードしてDevToolのコンソールからAPIテストを行えるツールです。上図はjqueryを読み込んだ瞬間のSSです。右側にライブラリが挿入されているのが確認出来るかと思います（わかり...
年表などのタイムラインUIを構築する為のライブラリ・「Labella.js」
Labella.js Labella.jsはタイムライン作成ライブラリです。上図のようなライン上にポイントとラベルを実装する事が出来る、というもの。ラベルは重なること無く他のラベルを避けてレイアウトしてくれます。なかなか良いのでは。ラ...
オープンソースのHTML5製パーティクルエンジン・「Proton」
Proton ProtonはOSSで公開されているHTML5製のパーティクルエンジンです。手軽に様々なタイプのパーティクルを実装、動作シミュレートが可能、とのこと。レンダラはCanvas、DOM、WebGL、Easeljs、pixel...
cssのflexboxを遊びながら学べるツール・「FLEXBOX FROGGY」
FLEXBOX FROGGY FLEXBOX FROGGYはflexboxをゲームで遊びながら学べるツールです。カエルをflexboxプロパティを使用して葉の上に持っていければOKというシンプルなもの。24レベルまで用意されています。...