ガジェット

世界時計を読み込み中

為替レート



Help menu

[an error occurred while processing this directive]

プルダウンメインメニュー

jQueryの便利なプラグインを簡単に設定可能にするインターフェース集です。 jQueryはもちろん、プラグイン、javascriptの知識も一切必要有りません。 難しい部分はすべてインターフェースが行います。 メニューエディタは、別途契約が必要な有料オプションです。 お問い合わせは、システムを導入された販売店にお願いいたします。
※本システムはjQueryやjQuery用プラグインを販売するものではありません。 無料で配布されているこれらオープンソースのフリーソフトをユーザに代わって設定するインターフェースです。 フリーソフトの著作権はjQuery及び、それぞれのプラグイン配布サイトにあります。
プルダウンメインメニューは、apycomが配布するプラグインの設定を行います。

プルダウンメインメニューは、1つのサイトで1つしか設計することが出来ません。
ネクストアイコン 下位階層メニューが有る場合のアイコン(矢印など)画像を設定します。 テーマにより自動で付けられる物もあります。
メインメニューアイコン 各メニューの項目名の前にアイコン(12×12)画像を表示することが出来ます。 項目ごとにアイコンを変更することは出来ません。 選択されたテーマにより不必要な場合や、邪魔になるものもあります。
サブメニューアイコン
チャイルドメニューアイコン
テーマ apycomが配布するテーマの一部を選択できます。
※テーマは自動的にインストールされません。プレビューのサンプルをご参照ください。
※テーマもオープンソースのフリーソフトです。弊社が動作を保障する物では有りません。
※テーマにより他のプラグイン、ブラウザとの相性が悪く正常に動作しない物があります。
メニュー項目設定
  • メニューの階層は3階層までです。 Mainにアドレス(Address)を設定すると下位の階層は無視されます。 同様に、Subにアドレスが設定されるとChildが無視されます。 当然のことながら、SubやChildから開始することは出来ません。
  • 下位の階層を含め、設定可能なメニューは、最大50件までです。 空欄を発見しだい、以下の項目すべてが無効になりますのでご注意ください。
  • Actionには、ジャンプするURLはもちろん、javascript:に続けてjavascriptの関数を指定できます。
  • 項目は行番号をドラッグして自由に移動させることが出来ます。
以上で階層化されたメニューの設計は完了です。
次は、完成したメニューを各ページに挿入します。 apyメニューはjQueryのプラグインですので、jQueryとapymenuのjavascriptをインクルードしなければなりません。
									
									<script type="text/javascript" src="/jquery/js/jquery-1.6.4.min.js"></script>
									<script type="text/javascript" src="/trycms/system.js"></script>
									<link type="text/css" href="/jquery/apymenu/theme04/menu.css" rel="stylesheet" />
									<script type="text/javascript" src="/jquery/apymenu/theme04/menu.js"></script>
									
								
1行目はjQuery本体です。3行目と4行目でメニューのスタイルとjavascriptをインクルードしています。
この2行の/theme04/がテーマのコードになります。この数値を01から22に変更してテーマを変更することが出来ます。
									
									<link type="text/css" href="/jquery/apymenu/theme15/menu.css" rel="stylesheet" />
									<script type="text/javascript" src="/jquery/apymenu/theme15/menu.js"></script>
									
								
両方を変更しなければ正常に動作しません。ご注意ください。
インクルードが設定が出来れば、実際にメニューを挿入する場所にSSIを挿入するだけです。
<!--#include virtual="/trycms/apymenu.php"-->
これで全てが完了しました。ページを表示させて正常に動作することを確認してください。
CGIやPHPでは、SSIで挿入することが出来ませんのでAjaxで挿入します。
									
									<div id="pulldownmenu">ここにメインメニューを挿入</div>
									<script type="text/javascript">
										getAjaxText('/trycms/apymenu.php', 'pulldownmenu');
									</script>
									
								
メニューのカスタマイズは、それぞれのテーマをディレクトリごとコピーして、menu.cssを編集します。 たとえば、theme01を元に変更を加える場合は、ディレクトリ/jquery/apymenu/theme01を同じディレクトリ内に/jquery/apymenu/original等に名前を変えてコピーします。 これでオリジナルのテーマができましたので、/jquery/apymenu/original/menu.cssは自由に変更していただけます。

コメント

Q3:メールアドレス