- 締切済み
アコーディオン
こちらのサイトからダウンロードしたスクリプトを使用しようとしたのですが、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-->
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- auty
- ベストアンサー率58% (284/486)
・ 私は、「自分の作ったソース」として、utf-8を使っていたので気づきませんでした。 ・ 現在のIEは、文字コード関連のトラブルも非標準のためか多いようです。 Ajaxもutf-8を使うし、やはり今後は、utf-8へ統一していくほうがよいのではないでしょうか。
- auty
- ベストアンサー率58% (284/486)
理解は出来ていませんが、先頭の2行をサンプルのままにしてみてください。 これで動きました。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
お礼
頭のソースはこうです。 <?xml version="1.0" encoding="iso-2022-jp"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Language" content="ja" /> <meta name="ROBOTS" content="ALL" /> ただ、これも全てサンプルのheadに置き換えても動かなかったのです。 それで判明したことがります。 サンプルのcharsetはutf-8でしたが、こちらのcharsetはiso-2022-jpで javascriptは外部に置くから関係ないと思っていたのですが、utf-8にすると動きました。 これはどうあってもiso-2022-jpで動かすことは出来ないのでしょうか?
お礼
他のサンプルもいろいろ試してみましたがやはりIEだけ正常に動作しませんでした。 しかし今回はutf-8にはできないので諦めるか、他の方法を探すか ウーン・・・