昔作ったJavaScriptのDockメニューを、jQuery抜きのVanillaで作りなおしたので紹介します。
何はともあれ、上図のようなマウスオーバーで拡大するメニューで、一時期はいろんなjQueryプラグインなどが出て流行った感じでしたが、なんともしっくりしないので自分で作ったものです。
最近アイコンをフォントじゃなくてSVGにしたものを作りなおしました。
egashira.jpを見てくださいな
コードは、githubにおいてありますが、依存関係とかないのでZIPファイルをそのままダウンロードして解凍しindex.htmlファイルをブラウザで開けば動作確認できます。
jsファイルだけならmin版が圧縮しないでも５００バイト程度なので、わりと使いやすいと思います。
各アイコンはアイコンフォントを使用して作ったもので、glyphter とか icomoonのサービスを使って簡単無料で作れますよ。
cssも書く必要がありますが、index.html内に書いてあるスタイルを参考にすれば難しいことはないと思います。