2012-01-10 8 views
5

Quello che voglio è specificare il cursore: puntatore per l'intero tag body, quindi lo sfondo della pagina è cliccabile, ma voglio anche che il resto della pagina funzioni come ha fatto, quindi provo a impostare il cursore: auto per div, che contiene la pagina.cursore: comportamento automatico in IE 8 e 9

In FF, Chrome e Safari funziona bene, anche in IE 6 e 7. Ma sembra che IE 8 e 9 e anche (avvitarlo) OPERA abbiano la loro opinione su quale cursore: auto significa.

Ecco un frammento per vedere cosa succede:

<!DOCTYPE html> 

<html> 
    <head> 
     <title>Cursor test</title> 
    </head> 
    <body> 

     <div id="newBody" style="width:400px; height:300px; cursor:pointer; background:#ffddee; border:2px solid #ddaa66;"> 
      <div id="pageContent" style="width:200px; cursor:auto; background:#fff;"> 
       <p>This is a paragraph <a href="">click here</a>.</p> 
      </div> 
     </div> 
    </body> 
</html> 

Anche se si tratta di un frammento di HTML tutto è fatto con javascript con lo stesso risultato.

Lo standard dice qualcosa di veramente vago: UA determina il cursore da visualizzare in base al contesto corrente. , Anche queste pagine non hanno aiutato sulla questione

http://www.w3.org/TR/CSS2/ui.html

http://msdn.microsoft.com/en-us/library/aa358795%28v=vs.85%29.aspx

http://www.w3schools.com/cssref/pr_class_cursor.asp

https://developer.mozilla.org/en/CSS/cursor

Qualcuno può spiegare questo comportamento o conoscere un possibile modo intorno ad esso?

risposta

2

Penso che auto stia ereditando lo stile genitore (non sicuro), ho provato cursor:default; e ha funzionato bene in IE 8 e FF 3.6.

<div id="newBody" style="width:400px; height:300px; cursor:pointer; background:#ffddee; border:2px solid #ddaa66;"> 
    <div id="pageContent" style="width:200px; cursor:default; background:#fff;"> 
     <p>This is a paragraph <a href="">click here</a>.</p> 
    </div> 
</div> 
+1

Sì, questo funziona un po 'meglio in IE rispetto al mio esempio true, ma ancora non funziona correttamente, il cursore sul testo è "predefinito", ma dovrebbe essere "testo". Può finire per impostare uno stile diverso per IE e FF. Per quanto riguarda l'ereditarietà, la domanda è come funziona automaticamente. E 'lo stesso che ereditare allora? – Olga

+0

per la mancanza di altri anwsers: accetta. Dopotutto, dovevo usare questo alla fine. Ancora curioso però. – Olga

6

Usa CSS:

#pageContent {cursor:default} 
#pageContent * {cursor:auto}​ 

Il cursore finisce ancora per essere sempre 'default' in IE, ma almeno altri browser visualizzare il comportamento previsto.

Problemi correlati