[グラフ] リストタグで簡単にパイチャートを実装できるPizza Pie Charts

Pizzachart

リストタグを入力するだけで、ビジュアル感のあるパイチャート(円グラフ)を貼り付けることができるPizza Pie Charts。マウスで%がポップアップするアクション付き。

画像を貼り付けるのではなく、動きのあるグラフが欲しい場合に最適。
導入も簡単(スクリプトをアップロードしてヘッダーで読み込み、HTMLタグを入力するだけ)なのでおすすめ。

[CSS/JS] ウィンドウサイズでフォントサイズを最適化するJS

ウィンドウの横幅(width)によって、font-size と line-height を変更して表示するという、レスポンシブレイアウトでは有効なJS。

最大フォントサイズと最小フォントサイズを指定できるので、これをキッチリと見やすいサイズで指定しておけば、小さくて文字が読めないといった問題は起きません。

[ FlowType.JS ]

[CSS/JS] 様々なエフェクトのスライドメニューのサンプル

ボタンを押してサイドメニューを表示させるサンプルスクリプト。
メニューがスライドする、メイン画面がスライドする、ドアのようにスライドするなど様々なアニメーションエフェクトが用意されています。

PCからスマートフォンまで、画面サイズにより可変するレスポンシブレイアウトでは、このようなサイドメニューが有効なようで多く見られますね。(PCではメニューを表示して、スマートフォンでは隠してボタンをタップするとメニュー表示するなど) 

[ Transitions for Off-Canvas Navigations ]