Visualizzazione dei risultati da 1 a 6 su 6
  1. #1

    Rollover menu particolare

    Ciao.
    Avrei la necessità di realizzare un menù da inserire in un sito, fatto come da immagine allegata.
    Al passaggio del mouse sulle varie "voci menù" dovrei fare in modo che lo sfondo si invertisse con il colore della scritta e viceversa (e questo so già come si fa), e al tempo stesso vorrei avere lo stesso effetto anche sul quadratino a fianco alla voce di menù su cui sto passando con il mouse...

    Io per ora (per gestire il menù senza inserire i quadratini a lato) ho creato un UL, definiti gli LI con display: block; e gestiti i vari cambi di colore... però non mi viene in mente come poter inserire i quadratini e gestire il cambio di colore anche di questi...

    Avete idea di come potrei fare?
    Grazie.

    Immagini allegate Immagini allegate

  2. #2
    Ah, "Voce principale" è una voce che non ha link, quindi non cambia colore al passaggio del mouse... per ora l'ho creata con un semplice DIV con sfondo e bordo, niente di più...


  3. #3
    Postaci il codice XHTML e CSS del menù, ovviamente depurato di tutto quel che non è pertinente al problema. Insomma, sii pulito.

  4. #4
    Questo nella pagina:
    codice:
    <div align="left">
    	<ul class="menu">
    		[*]Voce Menu
    		[*]Voce Menu[*]Voce Menu
    	[/list]
    	<div class="menu-voc-primaria">Voce primaria</div>
    	<ul class="menu">
    		[*]Voce Menu
    	[/list]
    </div>
    questo nel CSS:

    codice:
    ul.menu
    {
    	width:140px;
    	list-style:none;
    	margin:0; padding:0;
    }
    ul.menu li a {
    	display:block;
    	text-decoration:none;
    	padding:0 0.5em;
    	height:1.5em;line-height:1.5em;
    }
    ul.menu li { display:inline }
    ul.menu li a:link, ul.menu li a:visited 
    {
    	background:#dde8fc; border: #113986 1px solid; font-weight: bold; font-size: 12px; color: #113986;
    } 
    ul.menu li a:hover, ul.menu li a:active 
    {
    	background:#113986; border: #dde8fc 1px solid; font-weight: bold; font-size: 12px; color: #dde8fc;
    }
    div.menu-voc-primaria
    {
    	background:#113986; width:140px; border: #dde8fc 1px solid; font-weight: bold; font-size: 12px; color: #dde8fc;
    	padding:0 0.5em;
    }
    Grazie.

  5. #5

  6. #6
    Inizio a pensare che sia una cosa infattibile... dovrò trovare un'altra soluzione per questo menù!


Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.