ユーザーが「President [+]」をクリックすると、そのページ領域にジャンプして非表示の要素 (id="pres") が表示されるようにします。問題は、その領域にジャンプしないことですが、非表示の要素が表示されます。ここに私のHTMLコードがあります:
<p><a id="Pres" href="#pres"> <b>President :</b> Name <span>[+]</span> </a></p>
<div id="pres">
<a href="images/pres.jpg" rel="lightbox[group101]" class="membersPhotosVer"><img src="images/pres.jpg" /></a> <br/>
<p> bla bla bla </p>
</div>
Jクエリコード:
$("#pres").hide();
$("#vp").hide();
$("#sec").hide();
$("#fin").hide();
$("#med").hide();
$("#ev").hide();
var pvsfme = $("#pres,#vp,#sec,#fin,#med,#ev");
var PVSFME = $("#Pres,#Vp,#Sec,#Fin,#Med,#Ev");
PVSFME.click(function(e){
e.preventDefault();
var cli = $('#'+this.id.toLowerCase());
cli.show();
pvsfme.not(cli).hide();
$(this).addClass("media-selected");
PVSFME.not(this).removeClass("media-selected");
$(this).children("span").text("[-]").show();
PVSFME.not(this).children("span").text("[+]").show();
});
show/hide が原因でアンカー タグが機能していないのか、それとも重要な情報が抜けているのか疑問に思っています。