gpt4 book ai didi

jquery - 我怎样才能让这个 jQuery 按钮给我一个带有 .fadesIn div 框选项的下拉菜单?

转载 作者:行者123 更新时间:2023-12-01 05:56:07 25 4
gpt4 key购买 nike

我正在尝试在 TechCrew's Website 的中央 div 框右侧添加一个按钮。它将是一个小齿轮图标。它将有一个下拉菜单,其中包含显示附加信息的选项。我想我已经做对了,但它不起作用。帮助这个 Codecademy 菜鸟...看看吧:

The work in progress

HTML

<head>
<script src="jQuery/jquery-1.9.1.js"></script>
<script src="jQuery/ui/jquery.ui.effect.js"></script>
<script src="jQuery/ui/jquery.ui.effect-scale.js"></script>
<script src="jQuery/ui/jquery.ui.effect-shake.js"></script>
<script src="jQuery/ui/jquery.ui.effect-slide.js"></script>
<script src="jQuery/ui/jquery.ui.core.js"></script>
<script src="jQuery/ui/jquery.ui.widget.js"></script>
<script src="jQuery/ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="tcn_main.js"></script>
</head>
<body>
<div id="sidebox"><h2>Advisory Board</h2><!--This is the extra info that will pop up-->
<ul>
<li>Name1</li>
<li>Name2</li>
</ul>
</div>
<a href="#" class="jqbutton {icon: ui-icon-gear}">Show additional information</a><!--gear icon, text gets hidden-->
<ul id="menu"> <!--Dropdown menu inside the gear-->
<li class="ui-state-disabled"><a href="#">Who is advising you guys?</a></li>
</ul>
</body>

CSS

@import "jQuery/themes/base/jquery.ui.base.css";
@import "jQuery/themes/base/jquery.ui.theme.css";
#sidebox{
/*Let's have it start hidden (display:none) and use JavaScript to call it into existance upon request */
display:none;
float:left;
margin-right:auto;
margin-top:25%;
padding:5px;
-moz-box-shadow: 0 0 30px 5px #999;
-webkit-box-shadow: 0 0 30px 5px #999;
box-shadow: 0 0 30px 5px #999;
background-color:#fcde3f;
color:#be2226;
overflow:hidden;
min-width:200px;
max-width:500px;

}
#sidebox h2{
text-align:center;
}
.ui-menu {
width: 150px;
}
#menu{
display:none;
}
#options{

}

JavaScript

$(document).ready(function(){
$('#menu').menu();

$(".jqbutton").each(function(){
var data = $(this).metadata();
$(this).button({ icons: {primary:data.icon} });
});

$('.jqbutton').click(function(){
$('#menu').fadeIn('slow');
});

$('#menu a').click(function(){
$('#sidebox').fadeIn('slow');
});

});

最佳答案

这可能是因为您尝试通过 jQuery 获取的按钮的类是“class="jqbutton {icon: ui-icon-gear}”而不是“class="jqbutton”

尝试给一个ID,然后通过jquery获取ID。

所以添加:

<a id="myBtn" href="#" class="jqbutton {icon: ui-icon-gear}">Show additional information</a>

$('#myBtn').click(function(){
$('#menu').fadeIn('slow');
});

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com