次のjsfiddleに基づくコードを使用して、Webページでdivを表示/非表示にしていました: http://jsfiddle.net/XwN2L/420/
私のページの最初のナビゲーションバーの一部で機能します。他に考慮しなければならないナビゲーション バーが 2 つありますが、これらは同じコードを使用しています。例...
$('.showSingle').on('click', function () {
/* $(this).addClass('selected').siblings().removeClass('selected'); */
$('.targetDiv').hide();
$('#div' + $(this).data('target')).show();
});
$('.showSingle').first().click();
と
<div id="headnav">
<ul>
<li><a href ="#" class="showSingle" data-target="1">• HOME</a> </li>
<li><a href ="#" class="showSingle" data-target="2">• ABOUT US</a> </li>
<li><a href ="#" class="showSingle" data-target="3">• CONTACT</a> </li>
<li><a href ="#" class="showSingle" data-target="4">• WHERE TO BUY</a> </li>
</ul>
</div>
<div id="nav">
<ul>
<li><a href ="#" class="showSingle" data-target="5">• PIPE TOBACCO</a>
<ul>
<li><a href ="#" class="showSingle" data-target="6">KENTUCKY SELECT</a></li>
<li><a href ="#" class="showSingle" data-target="7">BUCKHORN</a></li>
</ul>
</li>
<li><a href ="#" class="showSingle" data-target="8">• ORGANIC TOBACCO</a></li>
<li><a href ="#" class="showSingle" data-target="9">• CIGARETTE TOBACCO</a></li>
<li><a href ="#" class="showSingle" data-target="10">• FILTER CIGARS</a></li>
<li><a href ="#" class="showSingle" data-target="11">• E-CIGARETTES</a></li>
</ul>
など... 詳細なリストについては、www.rcgraphicsstudio.com/ecryo をご覧ください。ヘッダーとフッターの両方が上下に固定されていることに気付くと思いますので、それが問題の原因でないことを願っています。