我有一个垂直的 2 级 jquery 菜单,我需要在单击链接并加载新页面后,菜单保持打开状态并突出显示所选链接。这是我的菜单代码:
<div id="my-menu">
<ul>
<li><span class="toggle">Una Passione</span>
<ul>
<li><a href="Trefratelli.aspx">Tre Fratelli</a></li>
<li><a href="Conlenostremani.aspx">Con le nostre mani</a></li>
<li><a href="#">La nostra storia</a></li>
<li><a href="#">Il video</a></li>
<li><a href="Libro.aspx">Il libro</a></li>
</ul>
</li>
<li><span class="toggle">Icone</span>
<ul>
<li><a href="Icone_Brera.aspx">Brera</a></li>
<li><a href="Icone_Magenta.aspx">Magenta</a></li>
</ul>
</li>
</ul>
</div>
这里是jQuery代码:
$(document).ready(function() {
$("span.toggle").next().hide();
$("span.toggleinterno").next().hide();
$("#my-menu a, #my-menu span.toggle").click(function() {
$(this).stop().animate( {
color:"red"
}, 300);
});
$("span.toggle").click(function() {
if ($(this).hasClass('second')) {
$(this).removeClass('second');
} else {
$(this).addClass('second');
}
});
$("#my-menu a, #my-menu span.toggleinterno").click(function() {
$(this).stop().animate( {
fontSize:"17px",
//paddingLeft:"10px",
color:"black"
}, 300);
}, function() {
$(this).stop().animate( {
//fontSize:"14px",
paddingLeft:"15",
color:"#808080"
}, 300);
});
$("span.toggle").css("cursor", "pointer");
$("span.toggleinterno").css("cursor", "pointer");
$("span.toggle").click(function() {
$(this).next().toggle(1000);
});
$("span.toggleinterno").click(function() {
$("span.toggleinterno").css("width", "100px");
$(this).next().toggle(1000);
});
});
感谢您的任何帮助。