Dreamweaver: rollover non funzionanti?

Di: linomari | 26/09/2020 17:13:51
salve, perchè i rollover impostati da proprietà pagina funzionano solo su Vista dal vivo (CS5) ma non sull'anteprima? (chiaramente con tutto salvato!)
Grazie

Risposte



I rollover sono regole di stile che può far comodo impostare da Proprietà di pagina. Intanto è indispensabile usare i termini tecnici informatici se intendi farti capire... la parola dal vivo va bene per i concerti... Tuttavia, senza nessun elemento, indicazioni più dettagliate o una porzione di codice, non credo sia possibile darti una mano con la sola richiesta perché non funzionano?.
Usa questo codice e magari mi fai sapere se funzionano, sull'anteprima:
<!--
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Rollover</title>
<style type="text/css">
<!--
a:link {
color: #0066CC;
text-decoration: underline;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #FF0000;
}
a:active {
text-decoration: none;
}
-->
</style>
</head>
<body>
<a href="#">Link di prova</a>
</body>
</html>
-->

Di: Gian Paolo | 26/09/2020 17:13:51


...per "dal vivo" intendevo la nuova funzione di CS5 "vista dal vivo" che evita appunto di salvare e vedere tutto nel browser, comunque questo è il mio codice:
a:link {
color: #CCC;
}
a:hover {
color: #F00;
}
a:visited {
color: #CCC;
che è quello che si genera in automantico impostando in proprietà pagina.
Ho notato che da browser (IE) la prima volta che si linka l'hover funziona, tornando sulla pagina non funziona più, è solo a questo il problema.
grazie

Di: linomari | 26/09/2020 17:14:51


Per forza scusa... a te sembra che non funzioni... se imposti a:visited { color: #CCC; significa che dopo l'evento onMouseOver, ossia il rollover, lo stato del link torna al punto di partenza "a:link" ma se provi a mettere
a:active {
text-decoration: none;
color: #0000FF;
}
Vedi che cambia e come...
Per essere più chiaro a:visited significa che una volta visitato il link all'interno della stessa pagina, l'evento hover non lo vedrai più. Io non lo uso mai in questo modo. Probabilmente ho capito anche cosa intendi fare: vorresti che in ogni pagina che apri, il rispettivo link rimanga evidenziato con un colore diverso dagli altri del menu... dovresti usare le classi e/o le pseudoclassi. Ti consiglierei di lasciar perdere la procedura da Proprietà di pagina e farti uno stile ad hoc per il menu.

Di: Gian Paolo | 26/09/2020 17:14:51


Provo a darti una mano... basta seguire attentamente il codice. Per ogni pagina nel menu normale usi le classi, invece per ogni pagina da evidenziare usi una pseudoclasse... ossia i link che iniziano con id hanno la pseudoclasse #activelink nel foglio di stile. Supponendo che abbia tre pagine con i classici link Home page - Chi siamo - Dove siamo Per evidenziare la home page il link deve essere così impostato <a id="activelink" href="home_page.htm">Home page</a> lo stesso devi fare per le pagine successive:
<!-- da non copiare
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Rollover</title>
<style type="text/css">
<!--
a.link {
font-family: Geneva, Arial, Helvetica, sans-serif;
color: #0066FF;
text-decoration: underline;
font-size: 12px;
}
a.link:hover {
font-family: Geneva, Arial, Helvetica, sans-serif;
color: #006600;
text-decoration: none;
font-size: 12px;
}
#activelink {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FF0000;
}
ul {
list-style-type: none;
margin-top: 4px;
margin-right: 0px;
margin-bottom: 4px;
margin-left: 4px;
}
li {
margin: 0px;
padding: 0px;
}
#boxmenu {
width: 200px;
border: 1px solid #EBEBEB;
height: 200px;
}
-->
</style>
</head>
<body>
<div id="boxmenu">
<ul>
<li><a id="activelink" href="home_page.htm">Home page</a></li>
<li><a href="chi_siamo.htm" class="link">Chi siamo</a></li>
<li><a href="dove_siamo.htm" class="link">Dove siamo</a></li>
</ul>
</div>
</body>
</html>
non copiare -->
Se vuoi approfittare del mio stato di grazia notturno ti consiglio come fare senza perdere tempo.
Copi il codice così com'è, e lo incolli in una pagina che inizialmente salverai col nome home_page.html. La stessa pagina la salvi col nome chi_siamo.html e farai le seguenti modifiche: nel link della home page toglierai id lo lascerai solo con la classe, cioè: <a href="home_page.htm" class="link">Home page</a> mentre nel link chi siamo <a id="activelink" href="chi_siamo.htm">Chi siamo</a>. Ugualmente farai con la pagina Dove siamo

Di: Gian Paolo | 26/09/2020 17:14:51


Grazie !

Di: linomari | 26/09/2020 17:14:51