|
|
| Line 3: |
Line 3: |
| | | | |
| | <head> | | <head> |
| | + | <script type="text/javascript" src="index3_files/prototype.js"></script> |
| | + | <script type="text/javascript" src="index3_files/effects.js"></script> |
| | + | <script type="text/javascript" src="index3_files/accordion.js"></script> |
| | | | |
| - | <script type="text/javascript" src="jquery.js"></script> | + | <script type="text/javascript"> |
| - | <script type="text/javascript" src="ddaccordion.js">
| + | Event.observe(window, 'load', function(){ |
| - | /***********************************************
| + | var acc = new accordion("accordion"); |
| - | * Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
| + | acc.activate($$("#accordion .accordion_toggle")[0]); |
| - | * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
| + | }, false); |
| - | * This notice must stay intact for legal use
| + | |
| - | ***********************************************/
| + | |
| | </script> | | </script> |
| - | <script type="text/javascript" src="wrapscroll.js"></script>
| |
| - |
| |
| - | <script type="text/javascript"><!--
| |
| - | ddaccordion.init({
| |
| - | headerclass: "expandable",
| |
| - | contentclass: "categoryitems",
| |
| - | collapseprev: true,
| |
| - | defaultexpanded: [0],
| |
| - | animatedefault: false,
| |
| - | persiststate: true,
| |
| - | toggleclass: ["", "openheader"],
| |
| - | togglehtml: ["suffix", "<img src='image/plus.gif' class='statusicon' />", "<img src='image/minus.gif' class='statusicon' />"],
| |
| - | animatespeed: "normal"
| |
| - | })
| |
| - | // wrapScroll
| |
| - | var mov = new wrapScroll('accordion_menu','container','header');
| |
| - | mov.marginTop = 5; //上からのマージンを指定(px)
| |
| - | //--></script>
| |
| - |
| |
| | | | |
| | | | |
| Line 109: |
Line 91: |
| | | | |
| | | | |
| - | <div id="accordion_menu"> | + | <div id="accordion"> |
| - | <a href="http://sawa-s.com/"><div class=" menuheader"> HOME< /div></a> | + | <div class=" accordion_toggle">< p class=" genre- name"> PS3</ p></div> |
| - | <div class="menuheader expandable">カテゴリ 1</div>
| + | <div style=" height: auto; display: block;" class=" accordion_content"> |
| - | <div class="categoryitems">
| + | |
| - | <ul>
| + | <li><a href="#"> アクション</a></li> |
| - | <li><a href="#">MENU 1-1</a></li>
| + | <li><a href="#"> アドベンチャー</a></li> |
| - | <li><a href="#">MENU 1-2</a></li>
| + | <li><a href="#"> シューティング</a></li> |
| - | <li><a href="#">MENU 1-3</a></li>
| + | ・・中略・・ |
| - | <li><a href="#">MENU 1-4</a></li>
| + | </ul> |
| - | <li><a href="#">MENU 1-5</a></li>
| + | </div> |
| - | <li><a href="#">MENU 1-6</a></li>
| + | <div class=" accordion_toggle">< p class=" genre- name"> PS2</ p></div> |
| - | </ul>
| + | <div style=" height: 0px; display: none;" class=" accordion_content"> |
| - | </div> | + | |
| - | <div class="menuheader expandable">カテゴリ 2</div> | + | |
| - | <div class="categoryitems">
| + | |
| - | | + | |
| - | <li><a href="#"> MENU 2-1</a></li> | + | |
| - | <li><a href="#"> MENU 2-2</a></li> | + | |
| - | <li><a href="#"> MENU 2-3</a></li> | + | |
| - | <li><a href="#">MENU 2-4</a></li>
| + | |
| - | <li><a href="#">MENU 2-5</a></li>
| + | |
| - | <li><a href="#">MENU 2-6</a></li>
| + | |
| - | <li><a href="#">MENU 2-7</a></li>
| + | |
| - | </ul>
| + | |
| - | </div> | + | |
| - | | + | |
| - | <div class="menuheader expandable">カテゴリ 3</div> | + | |
| - | <div class="categoryitems">
| + | |
| - | <ul>
| + | |
| - | <li><a href="#">MENU 3-1</a></li>
| + | |
| - | <li><a href="#">MENU 3-2</a></li>
| + | |
| - | <li><a href="#">MENU 3-3</a></li>
| + | |
| - | <li><a href="#">MENU 3-4</a></li>
| + | |
| - | </ul>
| + | |
| - | <div style="text-align:center;padding:5px;"><img src="image/akafuji.jpg" width="150" /></div>
| + | |
| - | <div style=" padding: 5px; font-size: 11px;" >メニュー内に写真を表示する事も可能です。</div> | + | |
| - | </div>
| + | |
| - | | + | |
| - | <div class="menuheader expandable">サンプル</div>
| + | |
| - | <div class="categoryitems">
| + | |
| - | | + | |
| - | <li><a href="collapseprev.html">複数のカテゴリを開く</a></li>
| + | |
| - | <li><a href="defaultexpanded.html">開くカテゴリを固定</a></li>
| + | |
| - | <li><a href="animatedefault.html">ロード後にアニメーションで開く</a></li>
| + | |
| - | </ul>
| + | |
| - | </div>
| + | |
| - | | + | |
| - | <div class="menuheader" style="cursor: default">Always Displays</div>
| + | |
| - | <div style="padding:5px;font-size:11px;">
| + | |
| - | 常に表示しておきたいテキスト・メールアドレス・カウンターなどをここに書く事が出来ます。<br />画像の挿入、リンクの設定、スタイルの指定も可能です。
| + | |
| - | </div>
| + | |
| | | | |
| - | <!-- / #accordion_menu --></div> | + | <li><a href="#">アクション</a></li> |
| - | </body> | + | <li><a href="#">アドベンチャー</a></li> |
| | </html> | | </html> |
"
