Comment placer une balise DIV sur hover (z-index) sur une cellule de table

Question

Cela semble être facile, mais pour une raison quelconque, cela ne fonctionne pas comme je le pensais. Je HTML qui ressemble à peu près comme ceci:

<TD align="center"> 
<DIV style="position: relative; z-index: 2; top: 0; left: 0; width: 100%; height: 100%"> 
</DIV> 
<SELECT DISABLED> 
<OPTION>Option 1 
<OPTION>Option 2 
</SELECT> 
</TD> 

Fondamentalement, je veux cette balise DIV pour survolez (z-index, pas verticalement au-dessus de) la cellule, puis jouer avec l'opacité et la couleur de la DIV afin qu'il semble que la cellule entière est désactivée (au lieu de simplement la balise SELECT).

L'histoire de retour pour cela est que je veux désactiver la balise SELECT, puis fournir une info-bulle pour expliquer à l'utilisateur pourquoi il est désactivé. Le problème est une fois que je désactive le tag SELECT, il désactive également l'événement mouseover, donc je ne peux pas faire une info-bulle.

Toute aide sur ce serait génial!

Answer 1

Je crois que quelque chose le long de ces lignes fonctionnera:

<TD align="center" style="position: relative; z-index: 1;"> 
<DIV style="position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%"> 
</DIV> 
<SELECT DISABLED> 
<OPTION>Option 1 
<OPTION>Option 2 
</SELECT> 
</TD> 

Le positionnement sur votre div ne fonctionnera pas à moins que le droit élément parent est également positionné