アコーディオン
こちらのサイトからダウンロードしたスクリプトを使用しようとしたのですが、DLしたままの単体では正常に動くのですが、組み込んでみるとうまくいきません。
http://www.dezinerfolio.com/2007/07/19/simple-javascript-accordions/
症状
IEとサファリでの挙動がおかしい。(但しサンプルのデータだと全てのブラウザで正常に作動する)Firefoxでは問題なし。
全く作動せず全て表示されてしまって動かないか、クリックして隠れている部分を表示させようとするとダラダラ~と自動的に表示を繰り返してしまいます。
自分の作ったソース内に丸ごとサンプルのソースをまるごと上書きしても挙動がおかしくなってしまいますので、スクリプトの文字コードがおかしいのじゃないかと思ってエディタで開いてみるとソースが正常に表示されません、shift-JISに変更しようとしても直りません。
何か解決方法はないでしょうか?
よろしくお願い致します。
head内にスクリプトへのリンクを記述
<script type="text/javascript" src="accordian.pack.js"></script>
bodyにonloadを追加
<body onload="new Accordian('basic-accordian',5,'header_highlight');">
body内にソースを丸ごと追加
<div id="basic-accordian" ><!--Parent of the Accordion-->
<div id="test1-header" class="accordion_headings header_highlight" >Home</div>
<div id="test2-header" class="accordion_headings" >About Us</div>
<div id="test3-header" class="accordion_headings" >Download</div>
<div id="test1-content">
<div class="accordion_child">
Welcome to the Homepage<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
</div>
</div>
<div id="test2-content">
<div class="accordion_child">
Here you will find more about us<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
</div>
</div>
<div id="test3-content">
<div class="accordion_child">
and... this is the download section<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
</div>
</div>
</div><!--End of accordion parent-->