• 締切済み

JavaScriptを使用したタブの扱い

現在、とある会員サイト内のページ作成を行っているのですが、一部難航してしまっており、検索しても中々思うように情報が見つかりません。 ・ページ自体はデザイン担当により作成。拾い物のJavaScriptを使用したタブメニューを使用している。(CSSによるデザインが組み込まれている。) ・タブはカテゴリ毎に分けられている。(例えば「1~4ページ目はタブ1、2~7ページ目はタブ2」のように) ・難航している部分は「↑で書いている「タブ2(2~7ページ目)に属するページに移動した際に、タブの状態が『タブ2が選択されている状態』にしてほしい」という要望 HTMLのbodyタグのonloadで設定する方法がないかと調べてみましたが、未だに見つかりません。 どなたかご存知であれば、お教えください。よろしくお願いします。

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

タブ内の表示をどのようにして行っているのか不明ですが、 1)最初に全タブの内容を読み込んで、表示の切り替えのみでタブ切り替えを行っている場合は、ご質問のようなことは起こらないと思われます。 2)タブ内の表示内容のみ、Ajaxなどで読み込んで表示内容を切り替える方法の場合、やはりご質問のようなことにならないと想像されます。 3)同じデザインの別ページを用意しておいて、タブの切り替え(ページの切り替え)ごとにロードし直す方法の場合、ご質問のような状態になると思われます。 そのときのタブの状態をクッキーに保存してから次のページをロードするようにし、各ページのロード時にはクッキーの内容に応じてタブをセットしてあげればよろしいかと。 (ユーザがクッキーを拒否設定などにしている場合は効きませんが…)

関連するQ&A

  • ページ読み込み時にcss、javascriptによるタブが崩れて表示されます

    cssとjavascriptでタブを作成したのですが http://www014.upp.so-net.ne.jp/kanikko/test/test.html これを組み込んだページを読み込んだときに、総てのタブのブロックが一瞬見える状態になります(htmlに書かれている内容が上から下にそのまま並ぶ感じです)(IE7で確認) そのページの内容が多いためでしょうか。 先にcssとjavascriptをページ読み込みより早く読み込む方法はあるのでしょうか?? アドバイスいただけたらと思います。 よろしくお願い致します。

  • タブ切り替えが出来るjavascriptを使用しています。

    タブ切り替えが出来るjavascriptを使用しています。 http://5am.jp/jquery/jquery_ui_tabs/ ここのサイトを参考にしてタブ切り替えが動くところまで行きましたが、 どうにかして、別ページからリンクをクリックした時に、特定のタブへ直接飛ぶようにしたいと思っています。 <script type="text/javascript">  $(function() {   $('#ui-tab > ul').tabs({ fx: { opacity: 'toggle', duration: 'fast' } });  }); </script> ヘッダーにある上記のjavascriptを少し編集すればできそうな気がするのですが、 もうお手上げになっちゃいました。 申し訳ないのですが、どなたか教えていただければと思います。 よろしくお願いします。

  • HP作成でjavascriptを使用したい

    こんにちわ。現在、私はHTML文書でHP作成をしている者です。 そこで、もっとレベルを上げたいと思い、javascriptを使用したい のですが、メモ帳にjavaのタグ?を埋め込んでも反映されません。 javascriptの長いタグのようなものをコピペして貼り付けているのですが不可能です。何故でしょうか。私のパソコンはwindowsXPです。 パソコン自体に起動する為のソフトが入っていないのでしょうか? それとも今の作成段階(HPに載らない状態)では反映されないのでしょうか?どなたか詳しい方、回答お願い致します。

  • JavaScriptでタブメニューを実装したいと思っています。

    JavaScriptでタブメニューを実装したいと思っています。 http://archiva.jp/web/javascript/tab-menu.html 上記サイトよりソースを頂いて実装したいと考えているのですが、こちらのサイトでは5つタブがあるため配列を使用しています。 今回実装したいページは、タブが2つのみなので配列は必要ないかと思いました。 色々調べても勉強不足のためどうしても条件分岐に書き換える方法が分からなく行き詰ってしまったため、お力添え頂きたく質問させていただきました。 大変申し訳ないのですが、教えていただければありがたいです。 どうぞ宜しくお願い致します。

  • CSSでのJavaScriptの書き方

    複数のページ内に同一の複数のJavaScriptがあるので CSSを使って省略したいのですが、 CSSとHTML両方での書き方が分かりません。 どなたか教えてください。

  • javascriptについて質問です。

    javascriptについて質問です。 ネットショップにて商品ページでjavascriptを使ってます。 海外の専門家にこのタグを入れてもらったのですが、いざ管理しているページへタグ挿入すると文字が化けてしまい同ページのショッピングカートもエラーで動かなくなってしまいました。 当初海外専門家からいただいたデータは現在なく、文字化けした位置に何が記入されていたのかわからない状態です。 契約させていただいているECサイト様へヘルプを依頼しましたが、HTMLやcss、javascript等のコーティングサポートが出来ないとの事で自身でなんとかしなくてはいけなくなりました。また、当初紺ページでは、javascriptを使わないでくださいとのことでしたが、jacvascriptタグ内容に文字化けしているのでもう一度見直しをしてみてくださいともご回答いただいております。 正直この機能を使って商品の販売をしてみたいのですが、修正して可能性があるなら使ってみたいと思っております。 使いたい機能のイメージは、このページのようなものです。 http://www.arumacce.com/shopdetail/006001000001/ このサイトのショッピングカーとの相互性などの問題も含め、何か対策がありまいたらご教示宜しくお願い致します。

  • インラインフレーム内に2つのタブを作成する方法

    ホームページ作成について、質問したいと思います。 実際に、使用されているページを見ていただいたほうが、分り易いと思います。 http://fc2.com/ 上記のページですが、中央のインラインフレーム内の上部に、2つの、「 お知らせ 」 と 「 新着記事 」 というタブがあります。これを入れるには、具体的に HTMLとCSSには、どのように記載するのが良いのでしょうか? 詳しい方がいましたら、よろしくお願いします。

  • タブの使用方法

    YAHOOのTOPページのトピックス、経済、エンタメ、スポーツ、その他のタブですか?いまいちわからないのですが非常に自分のサイトに使用したいので、このタブのhtml、css、分かる方いましたら教えて下さい。

  • ホームページ作成(タブ?利用)

    今、頼まれてHPを久しぶりに作成しているのですが どうせ作るなら、それなりのものを作りたいと考え そこで↓のHPの"企業情報"のようなタブ?があるメニューを作ろうと思っています。 「http://www.tella.jp/」 こういったメニューはどうやって作るのか、教えていただけないでしょうか? 知識的には一応HTML、CSS、JavaScriptの基本は本で一通り学んでいます

  • 再びJavaScriptについて。

    2件の回答どうもありがとうございました。 前回の変なメッセージが違っていました…"JavaScriptのオプションを指定して下さい。"でした。 せっかく回答してくれた方には申し訳ないです。一応、回答者のアドバイスに従い、早速、セキュリティー設定をいじくってみましたが、どうも上手く行きません。 ちょっと思ったのですが、HTMLのMETAタグを使用しているのですが…もしかしてこれがあるためにIE4.0以下ではバージョンの問題か何かで、変なメッセージが出てしまうのでしょうか?…JavaScriptは使用していないページなのに…

専門家に質問してみよう