アクティブ化されたときにページの別の領域に表示されるドロップ メニュー内にいくつかのサムネイルをネストしようとしています。そうすると、JavaScript が正しく機能しません。
$(document).ready(function(){
$("h4").append('<em></em>')
$(".thumbs a").click(function(){
var largePath = $(this).attr("href");
var largeAlt = $(this).attr("title");
$("#largeImg").attr({ src: largePath, alt: largeAlt });
$("h4 em").html(" (" + largeAlt + ")"); return false;
});
});
作業マークアップ:
<section class="group1">
<h3>Print</h3>
<p class="thumbs">
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
<a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a>
</p>
</section>
ネストされた<li>
:
<ul id="expandmenu">
<li>Digital
<ol>
<p class="thumbs">
<li><a class="clip" href="img/pen.png" title="awesome"><img src="images/picture1.jpg" /></a></li>
<li><a target="iframe2" href="Change font color rainbow.htm">Rainbow Fonts</a></li>
<li><a target="iframe2" href="Cookies_ShowUserName.htm">ShowUserName</a></li>
</p>
</ol>
</li>
</ul>