大家好, 早些时候,我收到了一些关于在照片库中的三个隐藏 div 之间切换的帮助。我想在 anchor 上添加下划线来切换要显示的 div。该脚本是动态的......这就是我的问题。我不知道如何判断代码中要在哪个 anchor 下划线。我只想说这超出了我的能力范围!
我还希望三个 anchor 中的第一个 Promo 以带下划线的方式加载。
感谢您的帮助!
HTML:
<div class="text" id="content">
<h2>PHOTOS</h2>
<hr />
<p align="left"><a class="showlink" id="show_promo">PROMO</a> <a class="showlink" id="show_studio">STUDIO</a> <a class="showlink" id="show_live">LIVE</a></p>
<div class="section" id="promo">
<p align="center">PROMO</p>
<p align="center">
<img src="#">
</p>
</div>
<div class="section" id="studio">
<p align="center">STUDIO</p>
<p align="center">
<img src="#">
</p>
</div>
<div class="section" id="live">
<p align="center">LIVE</p>
<p align="center">
<img src="#">
</p>
</div>
</div>
Javascript:
$('a.showlink').click(function(){
var toShow = this.id.substr(5);
$('div.section:visible').fadeOut(600, function(){
$('#' + toShow).fadeIn(600);
});
});
最佳答案
试试这个:
$(function(){
$('a.showlink').css("text-decoration", "none");
$("#show_promo").css("text-decoration", "underline").click();
});
$('a.showlink').click(function(){
$('a.showlink').css("text-decoration", "none");
$(this).css("text-decoration", "underline");
var toShow = this.id.substr(5);
$('div.section:visible').fadeOut(600, function(){
$('#' + toShow).fadeIn(600);
});
});
关于Javascript css下划线对应于切换的div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4643114/