链接在 jQuery 中显示切换的 Div 中不活动
我有一个菜单 div,它根据 jQuery 的点击来显示/隐藏,但是当您将它们放入 .. 想法时,没有任何链接处于活动状态?
我的列表中只有一项是超链接。一旦我可以让它工作,我会将它添加到其余的项目中..但是该链接不起作用。
jQuery
$(".sign_in").click(function() {
$("#sign_box").toggle();
return false;
});
$("body #main").click(function() {
$("#sign_box").hide();
return false;
});
CSS
#sign_box
{
-webkit-box-shadow: rgba(0, 0, 0, 0.296875) 0px 3px 3px;
width:170px;
background-color:#FFF;
border: 5px solid #CCC;
padding:8px;
position:absolute;
display:none;
z-index: 100;
line-height: 16px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
border-top-left-radius: 5px 5px;
border-top-top-radius: 5px 5px;
color: #555;
font-weight: bold;
text-decoration: none;
-moz-border-radius-topright:6px;
-moz-border-radius-bottomleft:6px;
-moz-border-radius-bottomright:6px;
-webkit-border-top-right-radius:6px;
-webkit-border-bottom-left-radius:6px;
-webkit-border-bottom-right-radius:6px;
}
.sign_in
{
color: White;
font-weight: bold;
font-size: 16px;
text-decoration: none;
background-color:#53A1DC;
border-bottom-left-radius: 4px 4px;
border-bottom-right-radius: 4px 4px;
border-top-left-radius: 4px 4px;
border-top-top-radius: 4px 4px;
border:solid 1px #5ea0c1;
padding:6px;
}
a.sign_in span
{
background-image: url("../images/toggle_down_light.png");
background-position: 100% 50%;
background-repeat: no-repeat;
padding-right: 18px;
}
HTML
<div><a href="#" class="sign_in"><span>User Options</span></a></div>
<div id="sign_box">
<ul class="account-links">
<li><a href="../raceday/events/list">All Events</a></li>
<li>My Events</li>
<li>My Profile</li>
<li>All Clubs</li>
<li>Change My Password</li>
<li>My Dependants</li>
</ul>
</div>
I have a menu div which shows/hides based on click with jQuery, but none of the links are active when you put them in .. ideas?
I only have one item in the list that is a hyperlink. Once I can get it to work, I'll add it to the rest of the items .. however that one link doesn't work.
jQuery
$(".sign_in").click(function() {
$("#sign_box").toggle();
return false;
});
$("body #main").click(function() {
$("#sign_box").hide();
return false;
});
CSS
#sign_box
{
-webkit-box-shadow: rgba(0, 0, 0, 0.296875) 0px 3px 3px;
width:170px;
background-color:#FFF;
border: 5px solid #CCC;
padding:8px;
position:absolute;
display:none;
z-index: 100;
line-height: 16px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
border-top-left-radius: 5px 5px;
border-top-top-radius: 5px 5px;
color: #555;
font-weight: bold;
text-decoration: none;
-moz-border-radius-topright:6px;
-moz-border-radius-bottomleft:6px;
-moz-border-radius-bottomright:6px;
-webkit-border-top-right-radius:6px;
-webkit-border-bottom-left-radius:6px;
-webkit-border-bottom-right-radius:6px;
}
.sign_in
{
color: White;
font-weight: bold;
font-size: 16px;
text-decoration: none;
background-color:#53A1DC;
border-bottom-left-radius: 4px 4px;
border-bottom-right-radius: 4px 4px;
border-top-left-radius: 4px 4px;
border-top-top-radius: 4px 4px;
border:solid 1px #5ea0c1;
padding:6px;
}
a.sign_in span
{
background-image: url("../images/toggle_down_light.png");
background-position: 100% 50%;
background-repeat: no-repeat;
padding-right: 18px;
}
HTML
<div><a href="#" class="sign_in"><span>User Options</span></a></div>
<div id="sign_box">
<ul class="account-links">
<li><a href="../raceday/events/list">All Events</a></li>
<li>My Events</li>
<li>My Profile</li>
<li>All Clubs</li>
<li>Change My Password</li>
<li>My Dependants</li>
</ul>
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
只有一项是链接,即“所有事件”条目。将锚标记添加到其余部分或通过 js 关联一个点击事件导航,让它们实际执行某些操作...
如果您确实已经连接了 js 代码,使 li 项目菜单可以到达某个地方,您也应该向我们展示该代码。 ..
Only one of the items is a link, the "All Events" entry. Add the anchor tag to the rest or associate a click event navigation via js to have them actually do something...
If you do have js code already wired up that makes the li items menus that go somewhere you should show us that code also...