Ciao, se qualcuno puo' darmi una mano ne sarei grato, è possibile creare un menù verticale multilivello e fare in modo che su ogni link ci sia un'immagine differente sia da inattivo sia in hoover?
Ho provato ad aggiungere al css delle class dei link in questo modo:
ma mentre funziona quando è inattivo non funziona in hoover.codice:a.first{ background-image:url(img/img_1.jpg); } a.second{ background-image:url(img/img_1a.jpg); } a.first:hoover{ background-image:url(img/img_2.jpg); } a.second:hoover{ background-image:url(img/img_2a.jpg); }
Vi posto il css e l'html, della base del menu su cui sto lavorando
CSS
HTMLcodice:/* Title: Vertical CSS menu with a behavior file. Author: Stefan Vervoort Blog: http://www.divitodesign.com/blog/ Article: http://www.divitodesign.com/blog/200...behavior-file/ */ .cont { width:150px; height:200px; margin-left:auto; margin-right:auto; } body { behavior: url(csshover.htc); } a { color: #000; text-decoration: none; } ul { list-style: none; margin: 0; padding: 0; width:150px; } ul li { font: bold 11px/16px arial, helvetica, sans-serif; height:100%; background:#ff8b8e; border-bottom:1px solid #fff; position: relative; float:left; width:100%; } ul li ul li{ background:#ffcf8b; } ul li a{ display:block; padding: 2px 3px; } ul li a:hover { color: #a00; background: #ffd3d4; border-right:1px solid #fff; border-left:1px solid #fff; } ul li ul li a:hover{ background: #ffedd3; border-left:1px solid #fff; } ul ul { position: absolute; top: 0; display:none; } ul li:hover ul{ display: block; left:150px; }
Ringrazio anticipatamente.codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Vertical CSS menu with a Behavior file.</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="cont"> <ul> [*]HOME [*]CHI SIAMO [*]PRODOTTI <ul>[*]SEMILAVORATI[*]SERVIZI[/list] [*]DOVE SIAMO[*]CONTATTI[/list] </div> </body> </html>

Rispondi quotando