如何更改菜单按钮周围的区域以使其可单击？

Question

我正在使用Shape5.com企业响应Joomla模板，并被要求更改“菜单”按钮的行为，以便当您的按钮背景突出显示时，将其移到该按钮上即可单击。 现在它的工作方式是，您必须在菜单标题内进一步移动鼠标，在此菜单中鼠标将光标从指针移到手以使其可单击。 如果用户在更改为手形之前单击它，则它不会执行任何操作，因为该单击尚未激活。 我被要求更改此设置，以便当它突出显示可单击菜单的背景时。 这是该网页的演示： http : //www.shape5.com/demo/corporate_response/

我不确定如何进行此操作。 这是CSS可以控制的东西吗？ 还是由JavaScript控制？ 当从菜单按钮的周围区域内移动鼠标并且突出显示的背景发生变化时，这仅是JavaScript的功能吗？ 还是CSS？

如果使用JavaScript，我该如何进行更改以了解其工作原理，是否使用像素来定义各种图像映射？ 谢谢！

Answer 1

我知道这很晚，但是我为此花了一段时间解决了这个问题，我想确保其他人可以找到答案。

只需在模板中放入custom.css即可使用CSS

active a {
color: #xxxxxx: !important; 
}

这意味着您不会对onclick函数和核心模板感到困惑。

Answer 2

原版的：

<span class="s5_level1_span1">
 <span class="s5_level1_span2">
   <a href="javascript:;">Tutorials</a>
 <span class="S5_parent_subtext" onclick="window.document.location.href="javascript:;"">Find Help Here</span>
 </span>
</span>

新

<a href="javascript:;">
   <span class="s5_level1_span1">
   <span class="s5_level1_span2">
   Tutorials
   <span class="S5_parent_subtext" onclick="window.document.location.href="javascript:;"">Find Help Here</span>
   </span>
   </span>
</a>

环绕跨度而不是文本，这将扩大可单击区域。

Answer 3

鼠标单击是浏览器事件，您可以使用javascript“挂钩”它，这意味着您可以在javascript中编写一个函数来执行单击操作。

在您的情况下，该功能归因于每个菜单项的文本，而不是项本​​身。 必须移动onclick从属性<span>与class="S5_parent-subtext" ，以<li>与class="mainParentBtn" ，每个菜单项。 但是，由于它是一个joomla模板，因此我认为HTML是用PHP生成的，因此您必须找到它的生成位置并进行更改。 而且我想您必须至少了解一点PHP和joomla的体系结构才能做到这一点...