我想要自定义属性来设置我的下拉菜单样式，或者使用我当前拥有的样式（使用div而不是）并使用jQuery来复制函数。
我目前认为我可能最适合后者，因为我的目标框（点击特定选项时会改变的目标框）与下面的选项不同。但是，我对任何有效的方法持开放态度。
在一个实例中，目标框将包含一个图标和标签，当点击下面的任何一个选项时，必须更改为该图标和标签（这是在我的jsfiddle的左侧）。另一个例子，目标框只包含一个图标，所以虽然下面的选项显示标签，但是当选中时，只有图标的文本值应该改变目标框。
希望以上内容有意义，下面的小提示应该可以帮助您想象它：
编辑*注意：带有字母的彩色框表示图标（我使用图标字体，因此每个字母代表一个图标），“Change Me”和“Label”代表需要更改的文本（at至少在左手边，右手边，只是图标交换）。
我当前的jQuery代码（它实际上只是用于下拉菜单功能...需要添加一些方法来切换目标框与点击的选项值。或者我想从html的方法去做它功能，只需重新设置它）
//sideUITopHead
$('#topHead').click(function(){
if($('#sideUITopHeadContainer').is(':hidden')){
$('#sideUITopHeadContainer').show();
$('#sideUITopHeadContainer').animate({'height':'456px'});
$('#topHead').addClass('active');
$('#topHeadToggle').addClass('active');
}
else{
$('#sideUITopHeadContainer').animate({'height':'0'}, function(){
$('#sideUITopHeadContainer').hide();
$('#topHead').removeClass('active');
$('#topHeadToggle').removeClass('active');
});
}
});
//sideUITopIcon
//more
$('#topIconMore').click(function(){
if($('#sideUITopIconMoreContainer').is(':hidden')){
$('#sideUITopIconMoreContainer').show();
$('#sideUITopIconMoreContainer').animate({'height':'456px'});
$('#topIconMore').addClass('active');
}
else{
$('#sideUITopIconMoreContainer').animate({'height':'0'}, function(){
$('#sideUITopIconMoreContainer').hide();
$('#topIconMore').removeClass('active');
});
}
});
感谢任何和所有帮助。谢谢！