Controllo immagine su altro frame.

[robalzi]

In un frame ho un menù col rollover di immagini creato così:

<script>
function over(cosa){
eval("document."+cosa+".src=\'img/titoli/"+cosa+"over.gif\'");
}

function out(cosa){
eval("document."+cosa+".src=\'img/titoli/"+cosa+".gif\'");
}

function clic(cosa){
eval("document."+cosa+".src=\'img/titoli/"+cosa+"down.gif\'");
}

</script>

Alle immagini ho dato questo comando:
<a onMouseOver="over('chi')"; onMouseOut="out('chi')" onClick="clic('chi')">[img]img/titoli/chi.gif[/img]</a>

E fin qui funziona.

Il pbm è quando, caricata una pagina o al click, l'immagine deve rimanere la stessa. Per far ciò avevo messo nella pagina caricata ('chi.htm') un comando di questo tipo:
<script language="JavaScript">
parent.topFrame.chi.src='chidown.gif';
</script>
e per cambiare lo cambia ma, ovviamente, come vado sopra col mouse sopra esegue i comandi sopra. Come posso "costringerlo" a tenere quell'immagine?

[robalzi]

Up.

[lleffe]

nelle tre funzioni metti una condizione:

se
chi.src='chidown.gif';
allora
nulla

o meglio ancora,

se
chi.src != 'chidown.gif';
allora
...tuo codice...

[robalzi]

Ci avevi pensato ma il pbm è che non c'è una sola immagine da cambiare: quello script l'ho fatto per ottimizzarne il cambio di 7.

[Mackey]

non ho capito il tuo problema... potresti spiegarti meglio?

intanto ti do un consiglio... se puoi, evita di usare eval... è un metodo deprecato...

<script>
function over(cosa){
document.images[cosa].src = "img/titoli/"+cosa+"over.gif";
}

function out(cosa){
document.images[cosa].src = "img/titoli/"+cosa+".gif";
}

function clic(cosa){
document.images[cosa].src = "img/titoli/"+cosa+"down.gif";
}
</script>

quando riuscirò a capire ti aiuterò anche per il resto...
ciao!

[robalzi]

Ho un menù con 7 immagini-pulsante ('chi.gif', 'dove.gif', 'nuovo.gif', ecc) a cui ho assegnato un nome nel tag img ('chi', 'dove', 'nuovo', ecc).

Ogni immagina ha la sua variante per l'over ('chiover.gif', 'doveover.gif', 'nuovoover.gif', ecc) e un'altra per il down ('chidown.gif', 'dovedown.gif', 'nuovodown.gif', ecc).

Per ridurre un po' lo script per l'over e per il down ho usato la funzione di cui sopra, in modo che bastasse dare il nome da inserire nella variabile per controllare ogni stato del pulsante (ad esempio nella funzione per controllare lo stato over).

<a onMouseOver="over('chi')"; onMouseOut="out('chi')" onClick="clic('chi')">[img]img/titoli/chi.gif[/img]</a>

function over(cosa){
eval("document."+cosa+".src='img/titoli/"+cosa+"over.gif'");
}

Lo script funziona perfettamente. Il pbm nasce se, per ogni pagina caricata in un altro frame, il pulsante NON deve cambiare e tenere caricata una sola immagine. Lì mi sono ingrippato.

[Mackey]

allora ti dico cosa ho capito...

le immagini fanno parte di un menu e sono bottoni...

supponiamo che le immagini linkano a delle pagine con nomi simili

chi.gif -> chi.html
dove.gif -> dove.html
nuovo.gif -> nuovo.html

ora... se ad esempio la pagina aperta nell'altro FRAME è dove.html l'immagine non deve cambiare quando ci passo sopra con il mouse o quando ci clicco... giusto?

allora basta fare...

<script>
function over(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+"over.gif";
}

function out(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+".gif";
}

function clic(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+"down.gif";
}
</script>

[robalzi]

Grazie, funziona.

C'è solo il pbm che le altre immagini mi restano allo stavo down finchè non ci torno sopra col mouse ma se metto un comando nella pagina caricata per cambiarle non ci dovrebbero essere pbm.

[Mackey]

allora fai così:

<script>
function mouseover(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+"over.gif";
}

function mouseout(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+".gif";
}

function mousedown(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
document.images[cosa].src = "img/titoli/"+cosa+"down.gif";
}

function mouseup(cosa){
var l = parent.NOMEDELFRAME.location.href;
l = l.substring(l.lastIndexOf("/")+1,l.lastIndexOf("."));
if(l!=cosa)
parent.NOMEDELFRAME.onload = function() {
document.images[cosa].src = "img/titoli/"+cosa+".gif";
};
}
</script>

<a onmouseover="mouseover('chi')"; onmouseout="mouseout('chi')" onmousedown="mousedown('chi')" onmouseup="mouseup('chi')">[img]img/titoli/chi.gif[/img]</a>

in alternativa alla parte in grassetto potresti provare
setTimeout('document.images[cosa].src = "img/titoli/"+cosa+".gif";',5000);