見栄えの良い Webページを効率よく作るには、これまでに出会ったさまざまなデザインや、過去に作成したパーツ類を、
シチュエーションに応じていつでもスムーズに使えるように、出来るだけ汎用性をあげて、時には作り直したりして、きちんと整理しておく事が大切だと思っています。
そう思ってストックしているパーツの一部をご紹介します。
WEB PARTS
Web Partse
サイト作りに使えそうなパーツ達
ハンバーガメニューのアイコン、いろいろ。
YES/NO ボタン、いろいろです。これもよく使います。
きちんと整理していつでも使えるように整理しておくと、Webを作成する時に悩まないで済みます。
テキストのデコレーションも動きを付けるとなると工夫が必要です。
どこかのサイトで見かけて、カッコいいなと思ったので作ってみました。
カーソルを乗せると動き出します。
TurnJSです。
本を表示するのに最も優れていると思うのがこの TuenJS ですが、情報が少ない上にレスポンシブに対応できていないので改造しました。
ブロックに iframe で配置すると、その高さに揃えてくれます。スマホの場合は単ページ表示になります。
全国地図です。
クリックして紹介動画を流したり、出身者の一覧やプロフィールを表示したりと、色々使えそうかと思って制作しました。
chartjs です。グラフを描く際に使いますが、使い方を忘れてしまうので、分かりやすく整理しておきます。
拡大鏡のJavaScriptです。動きが面白いと思います。
hover.js です。非常に種類が多いので、使う時の参考にサンプルページを用意しておきます。
写真を表示するのにはさまざまな方法がありまして、その内のひとつがこの muuri です。
初期表示が少し遅いのが玉にキズですが、読み込んでしまえば小気味よく動いてくれます。