メニューバー Widget の方向の変更

メニューバー Widget の方向を水平方向から垂直方向に、またはその逆に変更できます。これを行うには、メニューバーの HTML コードを変更し、Web サイトに適切な CSS ファイルがあることを確認します。

次の手順では、水平メニューバー Widget を垂直メニューバー Widget に変更しています。

Web サイトに "SpryMenuBarVertical.css" ファイルがあることを確認します。たとえば、このファイルは、サイト内の "SpryAssets" フォルダに格納されている可能性があります。
次に示すように、ドキュメントのヘッド内にある "SpryMenuBarHorizontal.css" ファイルへのリンクを "SpryMenuBarVertical.css" ファイルへのリンクに置き換えます。
```
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
```
水平メニューバーの HTML コードで MenuBarHorizontal クラスを見つけ、それを MenuBarVertical に変更します。 MenuBarHorizontal クラスは、メニューバーのコンテナ ul タグで定義されます (<ul id="menubar1" class="MenuBarHorizontal">)。

メニューバーのコードの後に、メニューバーコンストラクタを見つけます。

var menubar1 = new Spry.Widget.MenuBar("menubar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});

コンストラクタから imgDown プリロードオプション (およびカンマ) を削除します。
```
var menubar1 = new Spry.Widget.MenuBar("menubar1", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
```
注意：垂直メニューバーから水平メニューバーに変更する場合は、代わりに imgDown プリロードオプションとカンマを追加します。
(オプション) ページに他の水平メニューバー Widget が含まれない場合は、ドキュメントの head に埋め込まれている前の MenuBarHorizontal.css ファイルへのリンクを削除します。
ページを保存します。

Current page: http://livedocs.adobe.com/ja_JP/Spry/1.4/WS434A7040-787E-436a-AFB3-5C63CCFCB7B6.html