jQueryのiconDockプラグインを利用したドック型メニュー

説明補足説明コード関連書籍コメント投稿

このサンプルは、jQueryのiconDockプラグインを利用してドック型のメニューを表示します。マウスをイメージに移動するとドッグから飛び出します。マウスを遠ざけるとイメージがドックに戻ります。

このサンプルは、jQueryのiconDockプラグインを利用してドック型のメニューを表示します。マウスをイメージに移動するとドッグから飛び出します。マウスを遠ざけるとイメージがドックに戻ります。

イメージは縮小版と拡大版の2種類用意します。イメージの名前には「_35」と「_70」のようにサイズを付加します。このサイズは、iconMinSize:35, iconMaxSixe:70と対応します。

alerts_35.gif alerts_70.gif

var confDock = {   
  iconMinSide: 35,   
  iconMaxSide: 70,   
  distAttDock: 100,   
  coefAttDock: 2,   
  veloOutDock: 500,   
  valign: "top"  
}   
  
$(function() {   
  $("#iconDock").addDockEffect(confDock);   
});