Menu dinamico con file .css

kitemm

Nuovo Utente
16 Mag 2007
8
0
0
Ciao a tutti..

Ringrazio in anticipo chi volesse aiutarmi con un mio problema di gestione dei menu...

Il mio problema è questo...
Dovrei creare un menu dinamico a seconda del prodotto selezionato...
Ho 2 pagine:

default.aspx
prodotti.aspx

e un file nav.css con il seguente codice:

Codice:
#navigation ul{font: 100% bodoni mt,arial,times new roman,sans-serif; font-size: 10pt;color:white}
#navigation li{float: right;margin: 0 3px 0 0;padding:0;}
#navigation a{width: 90px;text-decoration: none;
    text-align:center;text-decoration: none;
    color: white;}
#navigation a:hover{color: #ADADAD}
#navigation li#activelink a,#navigation li#activelink a:hover{
    color: #F7D10C}


#navigation1{float:left; margin:0 0 0 0}
#navigation1 ul{font: 100% bodoni mt,arial,times new roman,sans-serif;font-size: 10pt;margin: 0;padding: 0;background:#1F56B5}
#navigation1 li{margin: 0 0 0;padding: 0}
#navigation1 a{display: block;width: 150px;line-height: 20px;text-decoration: none;
    border: 1px solid white;text-indent: 19px;color:white;
    }
#navigation1 a:hover{
    color: #ADADAD}
#navigation1 li#activelink a,#navigation1 li#activelink a:hover{
    color: #F7D10C}


#navigation2{float:left; margin:0 0}
#navigation2 ul{font: 100% bodoni mt,arial,times new roman,sans-serif;font-size: 10pt;margin: 0;padding: 0;background:#F4F4F4}
#navigation2 li{margin: 0 0 0;padding: 0;text-align:left;}
#navigation2 a{diplay:block;width:121px;line-height: 20px;text-decoration: none;text-indent: 9px;
    color:#1F56B5;
    }
#navigation2 a:hover{
    background: url('../images/sfondi/down2.jpg')}
#navigation2 li#activelink a,#navigation2 li#activelink a:hover{
    background: url('../images/sfondi/down3.jpg')}

Per gestirlo in modo dinamico il menu (ossia che vari a seconda del prodotto che seleziono dal menu verticale presente nella pagina default.aspx) mi è stato consigliato di richiamare il file nav.css nella pagina prodotti.aspx nel seguente modo:

Codice:
<head>
<link href="stileesterno.css" rel="stylesheet" type="text/css">
<style type="text/css">
/* qui metti le regole di css che devi personalizzare per quel prodotto */
</style>
</head>

fin qui tutto ok...
Il problema che ho è che non so proprio come impostare le regole di css in modo che il menu vari a secondo del prodotto richiesto...

Potete aiutarmi magari con un breve esempio?

In default.aspx faccio riferimento a nav.css in questo modo:

Codice:
<div id="navigation1">
	<ul>
	    <li><a href="prodotti.aspx?...">Otranto</a></li>
	    <li><a href="prodotti.aspx?...>Dubai - Dolce Vita</a></li>
	    <li><a href="prodotti.aspx?...">Dubai - Mag218</a></li>
	    <li><a href="prodotti.aspx?...">Padenghe</a></li>
	    <li><a href="prodotti.aspx?...">Monte Carlo</a></li>
	    <li><a href="prodotti.aspx?...">Mentone</a></li>
	</ul>

in pagine prodotti.aspx poi :

Codice:
<head>
<link href="nav.css" rel="stylesheet" type="text/css">
<style type="text/css">
/* qui metti le regole di css che devi personalizzare per quel prodotto */
</style>
</head>
.
.
.
<div id="navigation1" style="width: 150px; height: 21px">
	<ul>
	    <li id="activelink"><a>Otranto</a></li></ul></div>
	    
                         </td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td height="21"></td>
		</tr>
	             <tr>
		<td valign="top" bgcolor="#0000FF">
		 <div id="navigation2" style="width: 108px; height: 44px">
	           <ul>
	             <li><a href="prodotti.aspx?...">Nuccio</a></li>
		<li><a href="prodotti.aspx?...">Domenico</a></li>
		<li><a href="prodotti.aspx?...">Lara</a></li>
	    
	           </ul>
                        </div>
                        </td>
	            <td valign="top" background="../images/sfondi/right.jpg">
		<!-- MSCellType="empty" -->
		 </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td height="60"> </td>
		
	             </tr>
	             <tr>
		<td colspan="3">
		<img border="0" src="../images/sfondi/down1.jpg" width="135" height="12"></td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td height="12"></td>
		</tr>
	<tr>
		<td valign="top" colspan="4">
		<div id="navigation1" style="width: 150px; height: 21px">
			<ul>
	    		<li><a href="prodotti.aspx?...">Dubai - Dolce Vita</a></li>
	    		<li><a href="prodotti.aspx?...">Dubai - Mag218</a></li>
	   		<li><a href="prodotti.aspx?...">Php</a></li>
	    		<li><a href="prodotti.aspx?...">Css</a></li>

			</ul>
		</div>
	    </td>

e poi a secondo del sottomenu che scelgo ad esempio Nuccio (o Domenico o Lara, esempio di sottoprodotti)

Codice:
<div id="navigation1" style="width: 150px; height: 21px">
	<ul>
	    <li id="activelink"><a href="prodotti.aspx?...">Otranto</a></li></ul></div>
	    
                         </td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td height="21"></td>
		</tr>
	             <tr>
		<td valign="top" bgcolor="#0000FF">
		<div id="navigation2" style="width: 108px; height: 44px">
	             <ul>
	             <li id="activelink"><a>       Nuccio</a></li>
		<li><a href="prodotti.aspx?...">Domenico</a></li>
		<li><a href="prodotti.aspx?...">Lara</a></li>
	    
	             </ul>
                         </div>
                         </td>
		<td valign="top" background="../images/sfondi/right.jpg">
		<!-- MSCellType="empty" -->
		 </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
		<td height="60"> </td>
		
	            </tr>
	            <tr>
		<td colspan="3">
		<img border="0" src="../images/sfondi/down1.jpg" width="135" height="12"></td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td></td>
		<td height="12"></td>
		</tr>
	            <tr>
		<td valign="top" colspan="4">
		<div id="navigation1" style="width: 150px; height: 21px">
			<ul>
	    		<li><a href="prodotti.aspx?...">Dubai - Dolce Vita</a></li>
	    		<li><a href="prodotti.aspx?...">Dubai - Mag218</a></li>
	   		<li><a href="prodotti.aspx?...">Php</a></li>
	    		<li><a href="prodotti.aspx?...">Css</a></li>

			</ul>
		</div>
	    </td>

Forse il codice è poco chiaro...
Lo spiego

Apro la pagina default.aspx è ho un menu verticale con le seguenti voci (dove il riferimento al file nav.css è id=navigation1):

Codice:
-Otranto
-Dubai - Dolce Vita
-Dubai - Mag218
-Padenghe
-Monte Carlo
-Mentone

Cliccando su Otranto si dovrebbe aprire la pagina prodotti.aspx riferita ad Otranto con il menu composto in questo modo :

Codice:
-Otranto                ( id=navigation1 activelink)
      -Nuccio           (id=navigation2)
      -Domenico       (id=navigation2)
      -Lara              (id=navigation2)
-Dubai - Dolce Vita  ( id=navigation1 )
-Dubai - Mag218     ( id=navigation1 )
-Padenghe             ( id=navigation1 )
-Monte Carlo          ( id=navigation1 )
-Mentone              ( id=navigation1 )

Cliccando poi su Nuccio il menu nel modo seguente:

Codice:
-Otranto                ( id=navigation1 activelink)
      -Nuccio           ( id=navigation2 activelink)
      -Domenico       (id=navigation2)
      -Lara              (id=navigation2)
-Dubai - Dolce Vita  ( id=navigation1 )
-Dubai - Mag218     ( id=navigation1 )
-Padenghe             ( id=navigation1 )
-Monte Carlo          ( id=navigation1 )
-Mentone              ( id=navigation1 )

Data questa situazione, ora la domanda è questa:

Come imposto le regole css nel tag <stile>? ovvero chi mi puoi fare un esempio?

Codice:
<head>
<link href="stileesterno.css" rel="stylesheet" type="text/css">
<style type="text/css">
/* qui metti le regole di css che devi personalizzare per quel prodotto */
</style>
</head>

Ciao

Kite
 

kitemm

Nuovo Utente
16 Mag 2007
8
0
0
ciao a tutti...

scusate se quello che ho scritto in precedenza forse è illegibile e lungo...

Semplifico il problema...

Ho 2 pagine default.aspx e prodotti.aspx e un file .css
All'interno di default.aspx ho un menu verticale (formattatato tramite nav.css) di questo tipo:

Codice:
-Otranto
-Dubai
-Padenghe
e fin qui nessun problema visto che il menu è fisso.

Le voci di tale menu fanno tutte riferimento a alla pagina prodotti.aspx che genera un layout diverso a seconda del prodotto selezionato...

Ad esempio se clicco su Otranto il menu in prodotti.aspx dovrebbe essere:

Codice:
-Otranto
    -Nuccio
    -Domenico
    -Lara
-Dubai
-Padenghe

Anche tale menu prende la formattazione specifica dal file nav.css..
e cosi via uguale per Dubai e Padenghe...

In html questo mi è stato abbastanza semplice realizzarlo, con l'handicap però che ad ogni link (Otranto, Dubai, Padenghe..) corrisponde una pagina ad-hoc creata e quindi statica...

L'esempio è presente al link:

www4.webng.com/parmare/home.htm

Come faccio a realizzare questo con asp.net in una sola pagina che nel mio caso è prodotti.aspx?
E' possibile?

Mi potete aiutare per favore?sto combattendo da un po' di tempo con questo problema e non riesco a venirne a capo...

Confido in voi esperti ...

Grazie mille

Kite
 
Discussioni simili
Autore Titolo Forum Risposte Data
C Creazione Menu dinamico con Checkbox PHP 0
J menu dinamico a tendina con database PHP 13
metalgemini Menu dinamico con selezione di default Snippet Javascript 0
P menu dinamico con PHP PHP 0
M [PHP] Menu a tendina dinamico che non si aggiorna PHP 2
V Menu a tendina dinamico in php PHP 7
V menu dinamico PHP 10
S Menu' dinamico PHP 3
B creare menu dinamico Webdesign e Grafica 2
F Menu dinamico e xml XML 1
A menu dinamico scorrevole Flash 0
N Menu A Cascata Dinamico PHP 0
M Creazione menu a tendina Javascript 3
D menu con submenu orizzontale HTML e CSS 0
Cosina Menu fisso copre i titoli quando cliccati nel sommario jQuery Javascript 4
G creazione menu a tendina e invio a pagina php PHP 1
P Sub menu con Collapse. Javascript 0
R abilitare menu a tendina tramite relativa chekbox PHP 17
L Aiuto creazione menu mancante WordPress 0
S spostare il pulsante menu dropdown HTML e CSS 8
F Dropdown menu con tabella PHP 33
Spown [WordPress] Problemi visualizzazione su più browser + voci menu in movimento WordPress 1
A [WordPress] Menu bar WordPress 0
W [WordPress] Non si vedono le categorie da aggiungerle al Top Menu WordPress 3
M Inviare variabili da menu a tendina a pagina php con post PHP 6
M [PHP] Selezione da menu a discesa con 2 variabili PHP 0
F [WordPress] [HTML] Aggiungere una pagina solo allo sticky menu WordPress 4
M [PHP] Creare un menu a tendina con pdo PHP 18
M [Javascript] Caricamento menu da file esterno Javascript 8
W [HTML] Animazione menu mobile HTML e CSS 0
P [HTML] Eliminare doppio menu in wordpress WordPress 2
andreas88 [PHP] menu PHP 15
K [ASP.Net] Realizzazione menu a tendina dipendenti ASP.NET 1
M [HTML] problema spazio aggiuntivo tra elementi <li> di menu a tendina HTML e CSS 1
L [css e html] destra e sinistra (menu navigazione) HTML e CSS 3
P [Gratuito][Cerco] qualcuno per fare menu a tendina ottimizzato per mobile-responsive con css e html Offerte e Richieste di Lavoro e/o Collaborazione 3
P [HTML] Problema con menu orizzontale a tendina per sito web HTML e CSS 17
P [Javascript] Voce del menu evidenziata in base alla pagina attiva Javascript 48
V [WordPress] Come modificare link in tasto menu css WordPress 21
S [Javascript] [CSS] Spazio Bianco tra Slider e Menu foto Javascript 6
P [Javascript] problema menu responsive su aruba, editor bk Javascript 1
Hellgrom90 Hamburger menu non si chiude jQuery 1
K [Javascript] Finestra menu Javascript 1
Selenio89 [HTML] creare menu di navigazione HTML e CSS 2
C [Javascript] [HTML] Problemi: Overlay, Banner, Menu Javascript 4
C 3 Bug CSS AND HTML: Overlay-Banner-Menu HTML e CSS 0
C 3 BUG CSS AND HTML: OVERLAY - BANNER- MENU HTML e CSS 0
U [PHP] Selezione con menu a tendina e recupero selezione PHP 5
M Riadattamento funzioni per far scomparire un menu. jQuery 4
G [Javascript] Transition in OnClick Dropdown Menu Javascript 5

Discussioni simili