0

所以我有一个我想用于我的网站的按钮精灵（https://www.metsales.com/MetropolitanSales/microsite/epson/images/epson_buttons.png），我想知道是否可以设置一个每个按钮部分打开一个下拉菜单。

这可能有点令人困惑，但是对于每个按钮，当您将鼠标悬停在整个按钮上时，我在精灵中有一个悬停图像，但我想区分单击每个按钮上的箭头和按钮本身。因此，箭头将带来一个下拉菜单，而该按钮将带您进入概览页面。

我该怎么做呢？找不到任何有足够信息来帮助我的东西。

4

3 回答 3

1

是的，您需要做的就是调整每个按钮内的元素，在我的情况下，我使用a并div ul请查看此演示

http://jsfiddle.net/BFWQa/13/

并问任何问题是否符合您的预期。

于 2013-10-29T17:16:24.340 回答
1

简单的方法是在链接中放一个孩子，如果点击孩子...打开下拉菜单，如果不关注链接

相应地定位和调整孩子的大小

<a class="buttonClass" href="foo.html"><span class="toggleDropdown"></span></a>

查询

$('a.buttonClass').click(function(e){
   if( $(e.target).is('.toggleDropdown') ){
         /* prevent href being opened*/
          e.preventDefault()
         /* run dropdown code here */            
   }
})

用户不会看到孩子，因为它是透明的

于 2013-10-29T17:18:22.850 回答
0

您应该使用 frombackground-image和background-positionrules of CSS。有关更多详细信息，请查看此链接。

如果对您有帮助，请投票或/并将其标记为答案。

于 2013-10-29T17:11:26.203 回答