人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

アコーディオンを使ったページへ移動した際に、決まった動作をするように処理をしたいのですが、やり方がわかりません。以下のデモを参考にわかる方がいましたら教えて頂けたらと思います。
■デモ
http://www.geocities.jp/qntbd042/

javascript、xml、php等どのような方法でもかまいませんが、こちら側の都合としてはクライアントサイドで処理できる方が助かります。


●質問者: 雨の日
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:JavaScript PHP XML にわか アコーディオン
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● zebevogue
●35ポイント

ページ変遷後にCSSの header_highlight を div タグに指定してあげれば、

特定の部分をオープンにした状態にできます。

ですので、リンク元index.htmlから画面遷移する際にクッキーなどで押した a タグの id などを保存しておき、

変遷後のページではそのidを使い、JavaScriptもしくはPHPなどで、divタグにheader_highlightを

指定してあげればいいと思います。

protoload.jsですが、使った事はないので割愛します。

◎質問者からの返答

ご回答ありがとうございます。おっしゃる通りこのアコーディオンはページを読み込んだ際、classにheader_highlightが入っているものを開くようになっているようです。こちらの説明不足でしたがjavascriptのdocument.writeで指定箇所にheader_highlightを書き出すやり方は試したのですが、うまくうごきませんでした。

以下参照

http://q.hatena.ne.jp/1202807214


2 ● zebevogue
●35ポイント

再回答です。

http://q.hatena.ne.jp/1202807214

の方のものを使って書いてみました。Windows上のIE6/Firefox/Operaで動作確認しました。

index.htmlの方を以下の様にaタグに ?no=数字 を追加します。

この数字は、child.htmlのmenu1-header、menu2-headerの数字と対応させます。

child.htmlに以下のスクリプトを追加します。

function openTab() {
 var str = "";
 //URLの?以降をlocation.searchから取得、正規表現でno=(数値)の数値のみを取得。
 var no = location.search.match(/[?&]no=(\d+)(&|$)/);
 if(no != null){
 no = no[1];
 }
 for(var i = 1; i <= 4; i++){
 var test = "";
 if(i == no) {
 str = 'menu' + i + '-header';
 var d = document.getElementById(str);
 d.onclick();
 }
 }
}

また、dodyのonloadを変更します。

body onload="new Accordian('basic-accordion',5,'header_highlight');openTab();"

これで動くと思います。

◎質問者からの返答

ありがとうございます。無事うまくいきました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ