merhaba arkadaşlar. aşağıdaki örneği çalıştırıp butona bastığınızda bir
div açılıyor.
bu
div içine
form elemanları yerleştiriyorum. yanlız şöyle birşey oluyor. bir dropdown list koyduğumda ve bu dropdowndan seçim yapmak istediğimde
div yok oluyor. (normal'de mouse
div üzerindeyken divin kaybolmaması gerekiyor.)
bu sorunu nasıl çözebilirim.
Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script>
var page = {
getSize : function(){
var _window = {'width' : 0, 'height' : 0};
if(self.innerHeight){
_window.width = self.innerWidth;
_window.height = self.innerHeight;
}
else if(document.documentElement && document.documentElement.clientHeight){
_window.width = document.documentElement.clientWidth;
_window.height = document.documentElement.clientHeight;
}
else if(document.body){
_window.width = document.body.clientWidth;
_window.height = document.body.clientHeight;
}
return _window;
},
getScroll : function(){
var _window = {'X' : 0, 'Y' : 0};
if (typeof window.pageYOffset == "number"){
_window.X = window.pageXOffset;
_window.Y = window.pageYOffset;
}
else if(document.documentElement && document.documentElement.scrollTop){
_window.X = document.documentElement.scrollLeft;
_window.Y = document.documentElement.scrollTop;
}
else if(document.body && document.body.scrollTop){
_window.X = document.body.scrollLeft;
_window.Y = document.body.scrollTop;
}
else if(window.scrollY){
_window.X = window.scrollX;
_window.Y = window.scrollY;
}
return _window;
}
};
var requestTooltip = {
tooltip : null,
timer : null,
offX : 0,
offY : 0,
show : function(o, t, e){
if(!this.tooltip) this.tooltip = document.getElementById(t);
if(!this.tooltip.onmouseout) this.tooltip.onmouseout = this.mouseOutCheck;
if(!this.tooltip.onmouseover) this.tooltip.onmouseover = this.clearTimer;
this.position(o, e);
},
hide : function(){
this.clearTimer();
if(this.tooltip) this.timer = setTimeout("requestTooltip.tooltip.style.display = 'none'", 200);
},
contained : function(node){
if(!node) return;
while(node = node.parentNode){
if(node == requestTooltip.tooltip) return true;
}
return false;
},
position : function(o,e){
e = (!e) ? window.event : e;
var x = e.pageX ? e.pageX : e.clientX + page.getScroll().X;
var y = e.pageY ? e.pageY : e.clientY + page.getScroll().Y;
x += this.offX;
y += this.offY;
this.tooltip.style.left = x +'px';
this.tooltip.style.top = y +'px';
this.timer = setTimeout("requestTooltip.tooltip.style.display = 'block'", 200);
},
mouseOutCheck : function(e){
e = (!e) ? window.event : e;
var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
if((requestTooltip.tooltip != reltg) && !requestTooltip.contained(reltg)) requestTooltip.hide();
},
clearTimer : function(){
if(requestTooltip.timer) clearTimeout(requestTooltip.timer);
}
}
</script>
</head>
<body>
<input type="button" id="hede" name="hede" value="aç" onclick="requestTooltip.show(this, 'tt', event);" />
<div id="tt" style="background:#fff;border-bottom:2px solid #e2e2e2;border-right:2px solid #e2e2e2;width:200px;position:absolute;display:none">
<div style="border:1px solid #e8e8e8;padding:5px;">
bu bir deneme<br />
bu bir deneme<br />
bu bir deneme<br />
bu bir deneme<br /><br />
<select id="LocationID" name="LocationID">
<option value="">Seçiniz</option>
<option value="140661">Merkez</option>
<option value="202614">İstanbul Şube</option>
</select><br /><br />
<input type="text" id="hede" name="hede" />
</div>
</div>
</body>
</HTML>