div : cambio colore passaggio con il mouse (senza JS e senza liste)

[markzzz]

salve,

è possibile fare tutto ciò?

es :
HTML :

    <div class="userlist">	
        <div class="userlist1">		
            Primo dato
        </div>
        
        <div class="userlist2">
            Secondo dato
        </div>
        
        <div class="userlist3">
            Terzo dato			
        </div>
        
        <div class="userlist4">
            Quarto dato
        </div>			
    </div>

CSS :

    .userlist{width:710px; float:left; border-bottom:1px #000000 solid;}
    .userlist1{width:190px; float:left;}
    .userlist2{width:270px; float:left;}
    .userlist3{width:150px; float:left;}
    .userlist4{width:100px; float:left;}

io vorrei che, passandoci sopra al div, questo cambiasse semplicemente colore.

non vorrei usare le liste (anche perchè in questo caso non mi sembrano opportune) e, nemmeno , JS. ovviamente tenderei a escludere il :hover da css..visto che su IE a quanto pare non và!

con JS avrei fatto così :

<div class="userlist" onmouseover="this.style.background='#CCCCCC'" onmouseout="this.style.background='#FFFFFF'">

funziona alla perfezione, però bhò volevo imparare senza ricorrere ogni volta a JS

saluti

[bionicoz]

O bella nn sapevo che :hover sui div non funzionasse con explorer! Se così è dubito che potrai fare a meno di javascript.

[markzzz]

io ho idea che qualche modo ci dev'essere. molti siti anche visualizzabili da cellulare con JS disabilitato presentano quella tipologia di effetto

[ResianTaxidrive]

sai cosa potresti fare, invece dei div usa degli "a" e mettili a display:block. Poi metti il cursor:default così non ci si accorge che sono dei "pseudo link".

[markzzz]

si quella è una tecnica che ho usato spesso, soprattutto per i menù (anche perchè :link, :visited, :hover sui link è totalmente cross browser, e non dà problemi da nessuna parte).

il problema quì è un altro : dentro a questo div ho altri div, che hanno altri div.

sostanzialmente c'è quello principale con vari elementi, e appena lo "seleziono" cambia colore; spero di essermi spiegato

[ResianTaxidrive]

Originariamente inviato da markzzz
sostanzialmente c'è quello principale con vari elementi, e appena lo "seleziono" cambia colore; spero di essermi spiegato

in che senso lo "selezioni"??

[markzzz]

es.

div main
div 1 TITOLO
div 2 CONTENUTO
div 3 DATA
...

il main contiene tutti gli altri div. quando passo sopra con il mouse (questo intendo per "selezione") al div principale (cioè il div che contiene tutti gli altri div) devo cambiar colore al div main...

[ResianTaxidrive]

devono proprio essere altri div i figli del div che deve cambiare colore? senno' potresti mettere tutti span.

[markzzz]

bhè no, effettivamente potrei fare così. sostiruire i div interni con degli span, ma non sò se funziona a livello di distanze (width, ecc). ora provo, poi in caso scrivo il codice e i relativi dubbi.

fatto stà che l'unico modo per fare tutto questo (e che sia compatibile con i vari modi) resta sempre quello di affidarsi a questo trucco con i link

[markzzz]

che poi forse ho detto una falsità (e con questo topic spero di chiarire anche questa mia perplessità).

un classico onmouseover="this.style.background='#CCCCCC'" ho idea che non sia esattamente JS, ma un semplice HTML DOM, giusto? perchè se è così allora è compatibile con qualsiasi (cioè...quasi...) piattaforma... (o almeno, per pc/browser, cellulari & company mi interessa relativamente ora come ora).