タブをクリックするとdiv内が右ページへスライドし、かつクリックタブが他タブをクリックするまで指定色のままとなるJavascriptでhtmlを作成中です。FocusTabを使用すると右ページへスライドせずに飛んでしまうのですが、どうすれば両方機能させられるのでしょうか?<(_"_)>

<script type="text/javascript"><!--
function ChangeTab(tabname) {
document.getElementById(div1').style.display = 'none';
document.getElementById('div2').style.display = 'none';
if(tabname) {
document.getElementById(tabname).style.display = 'block';
}
}
function FocusTab(tabname,tabcolor) {
document.getElementById('tabA').style.backgroundColor = '#FFF';
document.getElementById('tabB').style.backgroundColor = '#FFF';
if(tabname) {
document.getElementById(tabname).style.backgroundColor = tabcolor;
}
}
// --></script>

<div id="glider">
<div>
<ul>
<li id="tabA"><a href="#div1" onclick="FocusTab('tabA','#00F'); ChangeTab('section1'); return false;">SHOP</a></li>
<li id="tabB"><a href="#div2" onclick="FocusTab('tabB','#00F'); ChangeTab('section2'); return false;">PRICE</a></li>
</ul>
</div>
<div id="form4">
<div class="slide">
<div class="content">
<div id="div1"></div>
<div id="div2"></div>
</div><!-- /content -->
</div><!-- /slide -->
</div><!-- /form4 -->
</div><!-- /glider -->

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2014/07/28 00:40:29
  • 終了:2014/07/28 21:41:28

ベストアンサー

id:a-kuma3 No.1

a-kuma3回答回数4523ベストアンサー獲得回数18792014/07/28 12:11:27

ポイント100pt

関数 ChangeTab() が Glinder.js の動きを見えなくしてしまっています(と、思います)。
タブの部分は、こうしてください。

<ul>
<li id="tabA"><a href="#div1" onclick="FocusTab('tabA','#00F'); return false;">SHOP</a></li>
<li id="tabB"><a href="#div2" onclick="FocusTab('tabB','#00F'); return false;">PRICE</a></li>
</ul>
id:m0r1y055

a-kuma3さん
いつもお世話になってます。
( ; ▽ ; ) ありがとうございます!ChangeTab()を消したら、うまくいきました♬ サーバの不具合のせいか、一部おかしなコードのまま質問が投稿されたにも関わらず、完璧な回答をいただき有り難うございます。このfunctionは必須だと勝手に思ってたので、自分一人で考えてたら絶対解決できませんでした。本当に助かりましたっっ。
(((<(_""_)>)))

2014/07/28 21:26:48
id:m0r1y055

念のため、はてな照会者のためにここにメモ。
質問のコーディングにあるsection1, section2は、div1,div2として投稿していたものが、修正前の状態で投稿されてしまったものです。ChangeTabは結局いらなかったので重要ではないですね。あと、gliderの中のidと多少異なってます。文字数制限のためわかりにくく失礼しました。

2014/07/28 21:40:54

その他の回答(0件)

id:a-kuma3 No.1

a-kuma3回答回数4523ベストアンサー獲得回数18792014/07/28 12:11:27ここでベストアンサー

ポイント100pt

関数 ChangeTab() が Glinder.js の動きを見えなくしてしまっています(と、思います)。
タブの部分は、こうしてください。

<ul>
<li id="tabA"><a href="#div1" onclick="FocusTab('tabA','#00F'); return false;">SHOP</a></li>
<li id="tabB"><a href="#div2" onclick="FocusTab('tabB','#00F'); return false;">PRICE</a></li>
</ul>
id:m0r1y055

a-kuma3さん
いつもお世話になってます。
( ; ▽ ; ) ありがとうございます!ChangeTab()を消したら、うまくいきました♬ サーバの不具合のせいか、一部おかしなコードのまま質問が投稿されたにも関わらず、完璧な回答をいただき有り難うございます。このfunctionは必須だと勝手に思ってたので、自分一人で考えてたら絶対解決できませんでした。本当に助かりましたっっ。
(((<(_""_)>)))

2014/07/28 21:26:48
id:m0r1y055

念のため、はてな照会者のためにここにメモ。
質問のコーディングにあるsection1, section2は、div1,div2として投稿していたものが、修正前の状態で投稿されてしまったものです。ChangeTabは結局いらなかったので重要ではないですね。あと、gliderの中のidと多少異なってます。文字数制限のためわかりにくく失礼しました。

2014/07/28 21:40:54
  • id:m0r1y055tan
    すみません、質問者です。
    補足を投稿したら、質問内容が編集途中のものに戻ってしまいました。また、何故かアカウントが二つ作成され、どちらのアカウントも削除ができません。改めて投稿させていただきます。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません