ASP.net菜单 - 如何在悬停时更改弹出图像

Question

我在ASP.net菜单中为具有子下拉菜单的菜单项设置了弹出图像。问题是我希望能够在悬停时更改图像，并且不确定我是否可以通过CSS或C＃来完成。

带箭头图片的菜单项：

ASPX代码：

<asp:Menu ID="Menu1" StaticPopOutImageUrl="~/Sites/0/PageLayouts/Images/Horizontal_Main_Arrow.jpg" ItemWrap="false" runat="server" Orientation="Horizontal">
<DataBindings>
    <asp:MenuItemBinding DataMember="MenuItem" TextField="Title" NavigateUrlField="URL" />
</DataBindings>
<StaticMenuStyle CssClass="TopStaticMenuStyle" />
<StaticSelectedStyle CssClass="TopStaticSelectedStyle" />
<StaticMenuItemStyle CssClass="TopStaticMenuItemStyle" />
<DynamicHoverStyle CssClass="TopDynamicHoverStyle" />
<DynamicMenuStyle  CssClass="TopDynamicMenuStyle" />
<DynamicSelectedStyle CssClass="TopDynamicSelectedStyle" />
<DynamicMenuItemStyle CssClass="TopDynamicMenuItemStyle" />
<StaticHoverStyle CssClass="TopStaticHoverStyle" />

页面来源：

<td onmouseover="Menu_HoverStatic(this)"
    onmouseout="Menu_Unhover(this)"
    onkeyup="Menu_Key(event)"
    id="ctl00_ContentPlaceHolder1_ctl00_ctl00_ctl00_Menu1n1">
  <table class="TopStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl00_ctl00_Menu1_4"
         cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr>
      <td style="white-space:nowrap;">
        <a class="ctl00_ContentPlaceHolder1_ctl00_ctl00_ctl00_Menu1_1 TopStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl00_ctl00_Menu1_3"
           href="Home.aspx" target="_self"
           style="border-style:none;font-size:1em;"
         >Our Expertise</a>
      </td>
      <td style="width:0;">
        <img src="../Sites/0/PageLayouts/Images/Horizontal_Main_Arrow.jpg"
             alt="Expand Our Expertise"
             style="border-style:none;vertical-align:middle;" />
      </td>
    </tr>
  </table>
</td>

Answer 1

您可以使用Javascript执行此操作 - 只需将以下属性添加到您的img标记：

  

的onmouseover = “this.src = '.. /站点/ 0 /页面布局/图像/ Horizo​​ntal_Main_Arrow_Highlighted.jpg';”

     

的onmouseout = “this.src = '.. /站点/ 0 /页面布局/图像/ Horizo​​ntal_Main_Arrow.jpg';”

（或者你的其他jpg是什么！）