Sostituzione immagine hover nei menu item

[WebDeveloper3]

Ciao,

ho inserito un immagine come oggetto dei menu:

<asp:Menu ID="Menu2" runat="server">
<Items>
<asp:MenuItem Text="Home" Value="Home" ImageUrl="../Images/Master/Home.png"></asp:MenuItem>
<asp:MenuItem Text="Prodotti" Value="Prodotti"></asp:MenuItem>
<asp:MenuItem Text="Contatti" Value="Contatti"></asp:MenuItem>
</Items>
</asp:Menu>

Mi piacerebbe poter sostituire l'immagine quando ci vado sopra col mouse. In html usavo semplicemente onmouseover="src='../Images/Master/HomeHover.png'"

Ho pensato di farlo con jquery. Ma non so come agganciare il menuitem.
Nel menuitem non riesco a definire nè un id ne una classe css.

Come faccio???

[djciko]

prova programmaticamente (o semplicemente nell'html), con il vecchio trucco del JS nel testo:

 protected void Page_Load(object sender, EventArgs e)
  {
            Menu menu1 = new Menu();

            MenuItem item1 = new MenuItem();
            item1.Text = "Home&nbsp;<img src=\"1.png\" onmouseover=\"javascript: this.src='3.png'\" onmouseout=\"javascript: this.src='1.png'\" />";

           MenuItem item2 = new MenuItem();
           item2.Text = "Prodotti&nbsp;<img src=\"1.png\" onmouseover=\"javascript: this.src='3.png'\" onmouseout=\"javascript: this.src='1.png'\" />";

           menu1.Items.Add(item1);
           menu1.Items.Add(item2);

           ph.Controls.Add(menu1);
}

ph e' un placeholder nella pagina html

l'ho provato e funziona

[WebDeveloper3]

ho provato a farlo dall'html sostituento a text la tua riga oppure mettendoci una semplice immagine ma mi dà diversi errori di compilazione.

<asp:Menu ID="Menu2" runat="server">
<Items>
<asp:MenuItem Text="Home" Value="Home" ImageUrl="../Images/Master/Home.png" ></asp:MenuItem>
<asp:MenuItem Text="<img src=\"../Images/Master/Home.png \" />" Value="Prodotti"></asp:MenuItem>
<asp:MenuItem Text="Contatti" Value="Contatti"></asp:MenuItem>
</Items>

Eccolo sul secondo menù Item. Forse sono io che sbaglio qualcosa.

[pietro09]

Non ho mai usato questo menu. Comunque, vedi se va

<asp:MenuItem Text="<img src=&quot;/ArchivioEsempi/immagini/logo-reg-tr.gif&quot; onmouseover=&quot;this.src='/ArchivioEsempi/immagini/logoregione.gif'&quot; onmouseout=&quot;this.src='/ArchivioEsempi/immagini/logo-reg-tr.gif'&quot; />Home" Value="Home" ></asp:MenuItem>

[djciko]

Cosi' funziona. Senza doppi apici.

<asp:Menu ID="Menu2" runat="server">
    <Items>
        <asp:MenuItem Text="<img src=1.png onmouseover=javascript:this.src='3.png' onmouseout=javascript:this.src='1.png' />" Value="Prodotti"></asp:MenuItem>
    </Items>
</asp:Menu>

[pietro09]

Cosi' funziona. Senza doppi apici.

<asp:Menu ID="Menu2" runat="server">
    <Items>
        <asp:MenuItem Text="<img src=1.png onmouseover=javascript:this.src='3.png' onmouseout=javascript:this.src='1.png' />" Value="Prodotti"></asp:MenuItem>
    </Items>
</asp:Menu>

Già, HTML5 se non sbaglio Me lo debbo proprio studiare

[djciko]

non e' Html 5

[pietro09]

non e' Html 5

html.it ha una buona guida HTML5 e leggevo (molto velocemente) proprio oggi. E' una specifica HTML5 la possibilità di mettere gli attributi senza apici.

[djciko]

Forse e' che il tag IMG viene interpretato da IE10, ma l'IDE e' VS 2008. Boh.
Prova..

[pietro09]

http://www.html.it/pag/19264/la-sintassi-di-html5/