2009-08-12 12 views
0

J'ai un gridview et quand je souris sur une colonne particulière, je charge un div externe (position: absolute) dans cette position. J'ai fait cela en appelant une fonction js dans l'onmouseover événement de la cellule gridview (gvTestGrid.cells [1] .attributes.add ("onmouseover", "loadDIV();")). Je suis en mesure de charger la div correctement sur le vol stationnaire de la souris, mais le problème est mon div chargé contient une liste déroulante et un bouton à l'intérieur. Lorsque j'essaie de déplacer ma souris à l'intérieur de la div pour cliquer sur le bouton ou sélectionner la liste déroulante, la div s'éloigne. Cela se produit après que j'ai ajouté événement onmouseout (gvTestGrid.cells [1] .attributes.add ("onmouseout", " removeDIV(); "))montrant le div flottant dans un gridview

sans onmouse à mon événement div reste là chargé sur le cell.Please gridview aide

je l'ai fait un petit échantillon

<html> 
    <div id="divPopup" onmouseout="removeDIV(this,event);" style="display:none;width:100px;height:100px;color:Navy;border:2px;border-color:Red;border-style:solid;"> 
    Yes its me 
    </div> 

    <table> 
    <tr><td>A</td></tr> 
    <tr><td>S</td></tr> 
    <tr><td onmouseover="loadDIV(event)" onmouseout="removeDIV(this,event);">D</td></tr> 
    <tr><td>E</td></tr> 
    </table> 

</html> 
<script language="javascript" type="text/javascript"> 
function loadDIV(evt) 
{ 
var myWin = document.getElementById('divPopup'); 
myWin.style.position='absolute'; 
myWin.style.left = evt.x; 
myWin.style.top = evt.y; 
myWin.style.display='block'; 

} 

function removeDIV(obj,evt) 
{ 
var myWin = document.getElementById('divPopup'); 
myWin.style.display='none'; 
myWin.style.left = 0; 
myWin.style.top = 0; 
} 
</script> 

si vous essayez d'entrer la souris dans le div, il se déplace loin.Toute solution pour cela s'il vous plaît ??

+0

s'il vous plaît poster votre code pertinent – Jason

Répondre

2

Que diriez-vous de supprimer le div une fois que vous avez terminé le travail dans le DIV que vous avez surgi? Donc, vous fermez le DIV lorsque vous cliquez sur le bouton dans la DIV (en supposant que cela fonctionne et devrait fermer après) ou d'une manière similaire.

0

Il semble que l'événement onmouseout devrait être attaché à la div.

+0

j'ai essayé aussi .. il fonctionne de la même manière –

1

Définissez un petit délai d'expiration pour masquer la div et désactivez ce délai dans le gestionnaire onmouseover pour la div.

0

Si vous n'avez pas de balises Ancre dans ce contenu, puis-je suggérer de la magie CSS?

CSS ici

a.MyCellPopup div.MyPopup {display:none;} 
a.MycellPopup {position:relative;} /* Make pop up's position relative to the anchor tag */ 
a:hover.MyCellPopup div.MyPopup {display:block;position:absolute;top:10px;left:10px} 

HTML Ici

<a href="#" onclick="return false;" class="MyCellPopup"> 
    <div class="MyPopup">POP UP STUFF without links (links won't work)</div> 
</a> 

Je onclick = "return false" s'ils cliquent sur la cellule, ils ne seront pas traduits en haut de la page. Le href doit être là ou bien IE ne reconnaîtra pas le vol stationnaire. J'ai eu cette idée de ZenGarden pour savoir comment faire des pop ups simples.

Si cela ne fonctionne toujours pas, je vous recommande vivement de visiter la bibliothèque YUI, ils ont un widget javascript pour exactement ce problème.

Questions connexes