V
vunet
It works and always has been working in IE/FF. But Safari cannot
expand select drop down list within this floating div element which
drags around. Copy/paste code shows the picture. Just click select
menu in Safari 3.
Any thoughts? Thanks.
<HTML><HEAD>
<style type="text/css">
..drag{
position:relative;
cursor:hand;
top: 120px;
left: 130px;
}
#vunet{
background-color:#ff0fff;
cursor:move;
width:190px;
filter:alpha(opacity=85);
-moz-opacity:.85;
opacity:.85;
}
</style>
<script type="text/javascript">
var ieDrag = document.all;
var ns6Drag = document.getElementById && !document.all;
//alert(ieDrag+' '+ns6Drag);
var dragapproved=false;
var allowDragging=true;
var z, x, y;
var ff=true;
function move(e) {
if (dragapproved) {
z.style.left=ns6Drag? temp1+e.clientX-x: temp1+event.clientX-x;
z.style.top=ns6Drag? temp2+e.clientY-y : temp2+event.clientY-y;
return false;
}
}
function drags(e) {
if (!ieDrag&&!ns6Drag)
return;
var firedobj = ns6Drag? e.target : event.srcElement;
var topelement = ns6Drag? "HTML" : "BODY";
while (firedobj.tagName != topelement&&firedobj.className != "drag")
{
firedobj = ns6Drag? firedobj.parentNode : firedobj.parentElement;
}
if (firedobj.className == "drag" && allowDragging == true) {
dragapproved = true;
z = firedobj;
temp1 = parseInt(z.style.left+0);
temp2 = parseInt(z.style.top+0);
x = ns6Drag? e.clientX: event.clientX;
y = ns6Drag? e.clientY: event.clientY;
document.onmousemove=move;
return false;
}
}
function doNotMove(){ dragapproved=false; allowDragging=false; }
function doMove(){ dragapproved=false; allowDragging=true; }
document.onmousedown=drags;
document.onmouseup=new Function("dragapproved=false;
allowDragging=true;");
</script>
</HEAD><BODY style="clear:none;">
<div id="vunet" class="drag" style="position: absolute; top: 120px;
left: 130px; z-index: 2;">
<table><tr><td><input id="123" value="12345" type="text"
onClick="this.focus();" onMouseMove="doNotMove();"
onMouseOut="doMove();">
<select><option value="12345">12345</option><option
value="67890">67890</option></select>
</td></tr></table>
<table><tr><td><a href=''>LINK</a></td></tr></table>
</div>
</BODY></HTML>
expand select drop down list within this floating div element which
drags around. Copy/paste code shows the picture. Just click select
menu in Safari 3.
Any thoughts? Thanks.
<HTML><HEAD>
<style type="text/css">
..drag{
position:relative;
cursor:hand;
top: 120px;
left: 130px;
}
#vunet{
background-color:#ff0fff;
cursor:move;
width:190px;
filter:alpha(opacity=85);
-moz-opacity:.85;
opacity:.85;
}
</style>
<script type="text/javascript">
var ieDrag = document.all;
var ns6Drag = document.getElementById && !document.all;
//alert(ieDrag+' '+ns6Drag);
var dragapproved=false;
var allowDragging=true;
var z, x, y;
var ff=true;
function move(e) {
if (dragapproved) {
z.style.left=ns6Drag? temp1+e.clientX-x: temp1+event.clientX-x;
z.style.top=ns6Drag? temp2+e.clientY-y : temp2+event.clientY-y;
return false;
}
}
function drags(e) {
if (!ieDrag&&!ns6Drag)
return;
var firedobj = ns6Drag? e.target : event.srcElement;
var topelement = ns6Drag? "HTML" : "BODY";
while (firedobj.tagName != topelement&&firedobj.className != "drag")
{
firedobj = ns6Drag? firedobj.parentNode : firedobj.parentElement;
}
if (firedobj.className == "drag" && allowDragging == true) {
dragapproved = true;
z = firedobj;
temp1 = parseInt(z.style.left+0);
temp2 = parseInt(z.style.top+0);
x = ns6Drag? e.clientX: event.clientX;
y = ns6Drag? e.clientY: event.clientY;
document.onmousemove=move;
return false;
}
}
function doNotMove(){ dragapproved=false; allowDragging=false; }
function doMove(){ dragapproved=false; allowDragging=true; }
document.onmousedown=drags;
document.onmouseup=new Function("dragapproved=false;
allowDragging=true;");
</script>
</HEAD><BODY style="clear:none;">
<div id="vunet" class="drag" style="position: absolute; top: 120px;
left: 130px; z-index: 2;">
<table><tr><td><input id="123" value="12345" type="text"
onClick="this.focus();" onMouseMove="doNotMove();"
onMouseOut="doMove();">
<select><option value="12345">12345</option><option
value="67890">67890</option></select>
</td></tr></table>
<table><tr><td><a href=''>LINK</a></td></tr></table>
</div>
</BODY></HTML>