Newsgroup: it.comp.lang.javascript
Titolo: sfondo immagine su href/onmouseover

ciao a tutti,
ho questo codice:
<div id="menu">
   <ul>
     <li><a href="#">01</a></li>
     <li><a href="#">02</a></li>
     <li><a href="#">03</a></li>
   </ul>
</div>
vorrei fare in modo che "onmouseover" venisse impostato lo sfondo 
immagine di ogni href, in base ad un array di immagini.
sto lavorando a sto codice ma non ne vengo a capo e non so come fare O_o
function hrefBg() {
   var arrayImg = new Array('path01','path02','path03');
   P = document.getElementById("menu").getElementsByTagName("a");
   T = P.length;
   for (var i=0; i<T; i++) {
     P[i].onmouseover = P[i].style.backgroundImage.src = arrayImg[i];
   }
}
ma non so dove e cosa sbaglio, nn funziona O_o
aiut!
-- 
vox

 ma non so dove e cosa sbaglio, nn funziona O_o
Allora... innanzitutto, backgroundImage è una proprietà "semplice"
dell'oggetto style e non ha altre proprietà: dunque non esiste la
proprietà src di backgroundImage. backgroundImage è una proprietà che
accetta una stringa come valore, la quale stringa deve indicare
l'url dell'immagine che vuoi impostare come sfondo nel formato "url
(indirizzo)"; pertanto, per impostare un'immagine di background a un
oggetto tramite javascript occorre scrivere una cosa del genere:
  oggetto.style.backgroundImage="url(indirizzoimmagine)"
Veniamo al secondo errore. Con l'istruzione che hai scritto, lasciando
stare il fatto di src appena discusso, ottieni il risultato di
assegnare una stringa all'event handler onmouseover; considera anche
che l'assegnazione funziona, per farla semplice, in maniera
"transitiva", cioè con un'istruzione del tipo
  a = b = c
assegni il valore di c sia a b che ad a.
Un event handler, però, deve essere una funzione; quindi tu devi
scrivere un'istruzione che dica "assegna all'event handler LA FUNZIONE
che esegue l'assegnazione dello sfondo". In sunto, una cosa così:
  P[i].onmouseover = function() {
    P[i].style.backgroundImage = "url("+arrayImg[i]+")";
  }
Osserva, però, che in questo modo cambi lo sfondo quando si verifica
l'evento mouseover... ma cosa succede quando l'utente muove il mouse e
si sposta dall'elemento? :)
-- 
Nando

 l'evento mouseover... 
Eh, si, ti piacerebbe. :P
-- 
~ "Non sono solitamente un uomo che prega,
ma se sei lassů, per favore salvami,Superman."
(Homer Simpsons)

   }
Una cappellata, pardon.
Occorre aggiustare un attimo il tiro, per questa assegnazione.
-- 
Nando

 e la tua gente! (mi piacciono i delirii mistici) :)
Sì sì, pardon, stavo scrivendo sovrappensiero (mai farlo, MAI).
Non ho neanche idea di quello che succederebbe con una mostruosità del
genere... ho mischiato il locale al globale, il tutto al niente,
l'essere al nulla... un disastro!
-- 
Nando

 l'essere al nulla... un disastro!
.. non crederai mica di cavartela così a buon mercato, eh? :) Dai,
analizza il codice che hai scritto e cerca di capire cos'è che hai
fatto e come si comporterebbe tale codice (e perché).
Alla prima questione ti rispondo io: hai fatto una closure.
P.S.
Noto che anche tu in quanto delirii mistici.. :D
-- 
~ "E' bello essere vivi.
Ci sono tante cose che non si possono fare da morti."

 si sposta dall'elemento? :)
uhm... ti ringrazio molto, ma ci deve essere qualcosa che non va in 
quello che ho appena corretto seguendo come posso il discorso.
qui c'e' la funzione completa:
function hrefBg() {
   var P,T;
   var arrayImg = new Array(
     'path..',
     'path..',
     'path..');
   P = document.getElementById("menu").getElementsByTagName("a");
   T = P.length;
   for (var i=0; i<T; i++) {
     P[i].onmouseover = function() {
     P[i].style.backgroundImage = "url("+arrayImg[i]+")";
     }
   }
}
e la inizializzo cosi':
window.onload = function() {
   hrefBg();
}
onmouseover ricevo questo errore:
Errore: P[i] has no properties
File sorgente: pippo.js
Riga: 11
riga 11 cioe':
P[i].style.backgroundImage = "url("+arrayImg[i]+")";
-- 
vox

 Noto che anche tu in quanto delirii mistici.. :D
Lasciamo perdere: è un periodo in cui ho troppe cose da fare e non
dovrei impiegare il mio tempo libero qui, a fuorviare i poveri utenti
in cerca d'aiuto!
-- 
Nando

 Occorre aggiustare un attimo il tiro, per questa assegnazione.
Bene, ora che ho sondato la reattività di ZER0 e ho verificato che è
ancora in forma (era questo il mio intento, cosa credete?), ti direi:
cambia approccio :)
Con il tuo, definendo un array di immagini nella funzione hrefBg e
utilizzando un'istruzione simile a quella che ti ho scritto (con
qualche *piccolissimo* accorgimento :)), ti ritroveresti a navigare nel
mare delle closures e non mi pare questo il caso di farlo. Io torno a
suggerirti i css ma se vuoi proprio usare js forse è meglio
"agganciare" in qualche modo gli url delle immagini agli elementi
anchor relativi. Ma davvero mi pare un delirio inutile.
-- 
Nando

 anchor relativi. Ma davvero mi pare un delirio inutile.
boh io sto solo cercando un modo per non dover scrivere qualche decina 
di css oltre il dovuto :-/
e per quanto riguarda le closures... sono cose che si mangiano? :)
-- 
vox

 i poveri utenti in cerca d'aiuto!
Ma perché no, è tanto divertente fuorviarli! ;)
-- 
~ "Quando ti rifiuti di imparare una lezione in un modo,
ti verrà ripresentata sotto un altro aspetto." (E.Caddy)

 e per quanto riguarda le closures... sono cose che si mangiano? :)
Puoi farti un'idea con google, se vuoi... io scappo, il lavoro mi
chiama :-/
-- 
Nando

 anchor relativi. Ma davvero mi pare un delirio inutile.
Concordo, a meno che non vi siano altre particolari ragioni.
-- 
~  "FINARMENTE  LI SFRATTATI AVRANNO UN TETTO SULLA  TESTA!
 ...però tirato ammodino, un  tegolo pe' vorta.." (Il vernacoliere)

 bell'errore).
Devo fuggire porca miseria... ma è sbagliato perché, cambiando il
valore di i, vado a riferirmi a un oggetto che non esiste, no? La cosa
rientrava nei "risultati ovvi": essendo il valore di i effettivamente
utilizzato quello pari alla lunghezza dell'array, sia per P che per
arrayImg andrò a riferirmi a un indice "fuori dai limiti".
Vabbuò, mò me n'haggia ì! Ciao :)
-- 
Nando

 Vabbuò, mò me n'haggia ì! Ciao :)
Ciao. :)
-- 
~ Il tempo è quello che fai di lui.

 il suddetto riferimento alla "i" della funzione esterna.
Giusto. Grazie.
Già non è facile, quando poi non si "pratica", come me, diventa ancora
più complicato. Perdonatemi :)
-- 
Nando