Immagine menu di navigazione

Salve,
eccomi con un'altro problema.
Ho cercato ma non sono riuscito a trovare la soluzione per cambiare l'immagine al passaggio del mouse sulla barra di navigazione.
Se fosse possibile magari anche con una transizione tra la prima e la seconda.
Grazie mille

Ciao, quell'effetto penso che non si possa ottenere tranne se fai un tuo menù personalizzato, l'unica cosa è usare l'opacity:

Codice:

ul.linklist li a img {
    opacity: 0.5;
}

L'immagine diventerà come patinata e una volta passato il mouse sull'immagine riprenderà l'aspetta originario.

grazie Dozy, avevo intuito leggendo che bisognava fare un menu nuovo personalizzato.
Per disattivare il menu di base?
grazie

Codice:

.mainmenu{ display:none;}

Ricordati di copiare anche gli url delle pagine prima.

grazie

Ancora una cosa, se vai nel mio sito (che al momento è una prova per capirci bene) vedi due bottoni per il nuovo menu, che cambiano immagine.... come posso fare una transizione tra di loro...eheh
dai che ce la fai.
il codice che ho usato è il tuo, questo: https://aiuto.forumattivo.it/t13904-ingrandire-immagini-al-passaggio-del-mouse
il primo esempio.

Ho creato un menu personalizzato e funziona perfettamente, l'unica cosa che non riesco a far funzionare è il bottone del login/logout.
Ho anche provato a copiare il codice di quello di base, prendendolo da "ispeziona elemento"...... ma niente da fare.
Potete aiutarmi?
grazie

Maurovr provi cosi CSS:

Codice:

#LGLoginbtn {
  top: 10px !important;
}

Corretto Dozy

ho provato ma non succede nulla!
Questo è quello che ho mwsso sul messaggio sull'indice:

Codice:

<li><a class="LGLoginbtn" href="/login">Login</a></li> 

e nel CSS il tuo.

I class hanno come attributo il punto( . ) mentre i (div) il cancelletto.

Prova a fare una sostituzione. Io il login lo vedo e funziona.

@cent i codici vanno messi nel tag code.

provi come ti ha detto dozy, se no trovi un altro tutorial,forse nn funziona.che forum hai phbb,2 3?

oK Dozy scusa

ho la 3.
Ho sostituito il # con il punto, ma non cambia nulla.
Ma il discorso del pulsante che cambia da login a logout... com'è che devo fare?
dovrò mettere due pulsanti o no?
non potete darmi la parte di codice dei due pulsanti?

metti questo nell javascript TUTTE LE PAGINE..Attivi anche il toolbar

Codice:

$(window).load(function () {
    document.getElementById("logout") || ($("#fa_toolbar").after('<div id="fa_menulist" style="display: none;"><form action="/login" method="post"><table style="width: 100%; text-align: center;"><tr><td style="width: 50%;">Username:</td><td style="width: 50%;"><input name="username" type="text" /></td></tr><tr><td style="width: 50%;">Password:</td><td style="width: 50%;"><input name="password" type="password" /></td></tr></table><div style="text-align: center; padding: 5px;"><input type="submit" name="login" value="Log In" class="button2" /></div></form>'),
    $('#fa_right .rightHeaderLink:first').click(function (a) {
        a.preventDefault();
        document.getElementById("fa_menulist").style.left = $(this).offset().left - 200 + "px";
        document.getElementById("fa_menulist").style.top = $("#fa_toolbar").offset().top + 30 + "px";
        "rightHeaderLink" == this.className ? (this.className += " active", $(this).css({
            color: "#333",
            "background-color": "#FFF"
        })) : (this.className = "rightHeaderLink", $(this).css({
            color: "",
            "background-color": ""
        }));
        $("#fa_menulist").fadeToggle()
    }))
});

ok grazie, devo dreare anche il secondo pulsante?
Se però devo tenermi il menu di base non serve più! o no?

Allora...
funziona anche disattivando il menu di base.
Però i miei due pulsanti (login/logout) sono sempre visibili, mentre mi piacerebbe che uno escludesse l'altro.
Suggerimenti in merito.
Intanto grazie _cent_

Prego :)

up

Nel recuperare il codice html del menu con ispeziona elemento, mi sono reso conto chene manca sempre una parte..... mi riferisco a:
- login
- logout
- registrati
Insomma non riesco a mettere insieme una parte di codice che gestisca questi tre elementi assieme, che si visualizzino quando servono oppure no!
Purtroppo le mie conoscenze sono molto limitate, quasi nulle!!
spero possiate darmi una mano.
grazie

Dozy™ ha scritto:I class hanno come attributo il punto( . ) mentre i (div) il cancelletto.

Prova a fare una sostituzione. Io il login lo vedo e funziona.

@cent i codici vanno messi nel tag code.

si, però c'è anche il tasto del logout... che non dovrebbe esserci!

Ciao maurovr, è questa la pecca di questi menu esterni.
Prova questo:

Codice:

<script language="JavaScript" type="text/javascript">
jQuery(document).ready(function () {
  if(jQuery('nomediv/class').length > 0) {
    jQuery('nomediv/class').html('');
  }
});
</script>

Ricordati di sostituire "nomediv/class".

Saluti, MartinoPio

provo
e poi ti dico.... grazie intanto

forse ho bisogno di qualcjhe aiuto in più... allora
ho i due pulsanti di login e logout inseriti nel div questo:

Codice:

<div id="mainmenu">
<ul>
        <li><a class="mainmenu" href="/" alt="Home" title="Home" />Home</a></li>
        <li><a class="mainmenu" href= alt="portal" title="portal" />portal</a></li>
   <li><a class="mainmenu" href="/faq" alt="FAQ" title="FAQ" />FAQ</a></li>
   <li><a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;"><img id="i_icon_mini_search" src="http://2img.net/i/fa/empty.gif" border="0" height="13" hspace="2" alt="Search" title="Search" />Search</a></li>
        <script type="text/javascript">//<![CDATA[
   var url_search = '/search';
   insert_search_menu();//]]>
   </script>
        <li><a class="mainmenu" href="/memberlist" rel="nofollow" alt="Memberlist" title="Memberlist" />Memberlist</a>
        <li><a class="mainmenu" href="/groups" alt="Usergroups" title="Usergroups" />Usergroups</a> </li>
   <li><a class="mainmenu" href="/profile?mode=editprofile" alt="Profile" title="Profile" />Profile</a> </li>
   <li><a class="mainmenu" href="/privmsg?folder=inbox" alt="no new messages" title="no new messages" />no new messages</a> </li>
        <li><a class="logout" href="/login?logout" >Logout</a></li>
        <li><a class="login" href="/login">Login</a></li>   
</ul>
</div>

poi il tuo codice lo metto in un modulo javascrip?
e modifico nomediv con mainmenu e class con logout?
e per il login devo aggiungere un codice uguale?
scusa la mia incompetenza!

scusa,ma tu non hai toolbar per fare logout o login? perche usi questo?

voglio sostituire tutta la toolbar

hai attivato login Popup o forse e disativato??