フルスクリーン動画からスムーズにスマフォのモックアップに移行するイントロテンプレート・「Immersive Video Template」 Immersive Video Template Immersive Video Templateはcodyhouseで紹介された、動画を使ったWebサイトのイントロのサンプルです。フルスクリーン動画で始まり、スムーズにスマフォのモッ...2017.01.14 | 10時38分02秒
高度なイベントカレンダーアプリの為のjQueryプラグイン・「FullCalendar」 FullCalendar FullCalendarは高度なイベントカレンダーアプリを実装出来るjQueryプラグインです。jQueryUIも使用可能、Googleカレンダーにも対応しています。多言語化も済んでおり、日本語ファイルも用意...2017.01.11 | 11時04分03秒
Webページとして公開もできるjsfiddleライクなコードテストツール・「PLAYCODE」 PLAYCODE PLAYCODEはWebページとして公開もできるjsfiddleライクなコードテストツールです。jsfiddleのようにHTML、CSS、JavaScriptをブラウザで動作テストできる、というツールですが、本ツール...2017.01.09 | 10時25分04秒
マテリアルデザインの仕様にインスパイアされた軽量CSSフレームワーク・「kernel.css」 kernel.css kernel.cssはマテリアルデザインの仕様にインスパイアされたCSSフレームワークです。軽量でセマンティックな設計を心がけているそう。Googleが提唱したマテリアルデザインの考え方、目的を元に開発されたもの...2017.01.08 | 10時22分40秒
いろいろなスタイルのボタンを実装出来るスタイルシート・「bttn.css」 bttn.css bttn.cssはいろいろなスタイルのボタンを実装出来るスタイルシートです。種類はそこまで多くないですが、それぞれのボタンは最小、小、中、大の太さが用意されており、ブロック要素/インライン要素、5色のカラーが用意され...2017.01.05 | 10時13分47秒
CSSで作る様々なメニューを大量にまとめた・「110 CSS Menu」 110 CSS Menu 110 CSS MenuはCSS(と、少しのJavaScript)で作るメニューを大量にまとめたWebページです。110個あるかは明記されてないし数えてもないので分かりませんが、読み込みがやたら重いので結構な...2017.01.04 | 10時13分12秒
軽量で非依存のパララックス実装スクリプト・「Rellax.js」 Rellax.js Rellax.jsは軽量で他ライブラリに依存しないパララックス実装スクリプトです。少し前に流行って今は割と普通に見かけるようになった視差効果のあるWebページの制作をサポートしてくれる、というもの。ファイルサイズは...2016.12.30 | 10時40分31秒
大量のCSSフレームワークやライブラリ、スニペット、ツール等をコレクションしている・「CSSReflex」 CSSReflex CSSReflexは大量のCSSフレームワークやライブラリ、スニペットやツール等をコレクションしているWebサイトです。よくあるキュレーションサイトですね。レスポンシブの計算機やフィルターツールなどもありますが、特...2016.12.28 | 10時33分35秒
モジュール形式のWordPressテーマ開発向けフレームワーク・「Cherry Framework」 Cherry Framework Cherry FrameworkはWordPressテーマ開発フレームワークです。GPLライセンスの元、OSSとして公開されています。専用のプラグイン(高度検索化、不動産ツールなど)も複数開発されてお...2016.12.23 | 10時12分33秒
disple:tableを使ったモバイルファーストなCSSグリッドシステム・「Table Grid」 Table Grid Table Gridはdisple:tableを使ったモバイルファーストなCSSグリッドシステムです。といっても実用性を考えて作った重要性の高いプロジェクトではなく、単に実験的に作ったようです。floatやfle...2016.12.21 | 10時25分58秒
ラジオボタンにアニメーションエフェクトを付与する為のスタイルシート・「Radiobox.css」 Radiobox.css Radiobox.cssはラジオボタンにアニメーションエフェクトを付与するCSSです。上図のようにチェックを入れるとラジオボタンがアニメーションします。使い方は簡単で、CSSを読み込んでiinput要素にcl...2016.12.18 | 10時51分41秒
スマフォで画面下へスワイプしてWebページを更新させられるスクリプト・「PulltoRefresh.js」 PulltoRefresh.js PulltoRefresh.jsはスマフォで画面下にスワイプしてWebページをリフレッシュ出来るスクリプトです。ページ一番上の状態で下にスワイプするとページを更新する事ができる、というもの。マークアッ...2016.12.16 | 10時36分25秒
シンプルで非依存、軽量なカルーセルスクリプト・「Siema」 Siema See the Pen Siema - nested carousels by kachibito (@kachibito) on CodePen. Siemaはシンプルで軽量、非依存型のカルーセルを実装するスクリプトで...2016.12.14 | 10時30分08秒
複雑なCSSアニメーションを処理する為のシンプルなスクリプト・「Choreographer.js」 Choreographer.js Choreographer.jsは複雑なCSSアニメーションを設定、処理する為のシンプルなスクリプトです。アニメーションを定義すると、指定した要素にインラインCSSが付与、DOMイベントを介して実行、...2016.12.10 | 10時26分00秒
CSSで出来る画像エフェクトをまとめた・「Image Effects with CSS」 Image Effects with CSS Image Effects with CSSはCSSのみで出来る画像へのエフェクト効果を実装するコードをまとめているWebサイトです。主にブレンドモードやフィルターを使ったエフェクトを紹介...2016.12.04 | 10時25分00秒
JSONから高性能なtableを作成してくれるスクリプト・「Tabulator」 Tabulator TabulatorはJSONデータからインタラクティブに高性能なtableを生成してくれるスクリプトです。jQueryに依存しています。ソート、ページネーション、データのグラフィカル表示、セル内の内容編集などなど高...2016.11.29 | 10時05分12秒
設定したplaceholderにアニメーションエフェクトを付与する・「FoxHolder 」 FoxHolder FoxHolderはinput等に設定したplaceholderをフォーカス時にアニメーションエフェクトを付与する為のセットです。エフェクトは15種類用意されています。基本的にはCSSとJSファイル(jQuery...2016.11.28 | 10時22分00秒
HTML要素1つで、やや複雑な動きが出来るCSSスピナー・「CSSPIN」 CSSPIN CSSPINは1つの要素で、上のようなそこそこ複雑な動きが作れる、CSSのみで作れるスピナーです。それぞれの動きはそれぞれCSSファイルが用意されているので必要な動きのファイルだけ読み込めば使えます。なかなか使いやすそう...2016.11.22 | 10時33分00秒
Googleリッチスニペット対応の、WebページにオリジナルのLikeボタンを付けるスクリプト・「LikeBtn」 LikeBtn LikeBtnは任意のWebページにLike/Dislikeボタンを付けられるスクリプト。jQueryに依存します。上デモのように日本語にも対応しています。少し微妙ではありますが・・w 念の為、Facebook...2016.11.18 | 10時35分10秒
使いやすさを意識したReactのWeb用UIコンポーネントのコレクション・「Blueprint」 Blueprint BlueprintはReactのWeb用UIコンポーネントをコレクションにして提供してくれるUIツールキットです。使いやすさを特に意識して構築したそう。汎用的なUIは一通り揃っている印象です。ドキュメントページに動...2016.11.17 | 10時42分23秒
画像をアップロードする前にロード、プレビューするjQueryスクリプト・「LoadImg」 LoadImg See the Pen QGENKq by kachibito (@kachibito) on CodePen. LoadImgは画像をアップロードする前にプレビューするスクリプトです。jQueryに依存します。上デ...2016.11.15 | 10時20分07秒
jQueryとBootstrapで作るシンプルなスケジューラー・「pit-scheduler」 pit-scheduler pit-schedulerはjQueryとBootstrapで作るスケジューラーです。横長のカレンダーに蛍光ペンで引くようにスケジュールを設定、管理出来る、というもの。現状の仕様ではタスクの設定はちょっぴり...2016.11.13 | 10時21分26秒