...

View Full Version : Can't drag pop-up div



ryzer
08-30-2011, 12:01 PM
Hi All,

I'm new to the CF forums and also to JavaScript. Trying to get a pop-up div to be draggable, but it doesn't seem to be working. Can someone help me out? I'd be very grateful!

JavaScript I'm using:


//used for dragging div
function agent(v)
{
return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0));
}
function xy(e,v)
{
return(v?(agent('msie')?event.clientY+document.body.scrollTop:e.pageY):(agent('msie')?event.clientX+ document.body.scrollTop:e.pageX));
}

function dragOBJ(d,e)
{

function drag(e)
{
if(!stop)
{
d.style.top=(tX=xy(e,1)+oY-eY+'px');
d.style.left=(tY=xy(e)+oX-eX+'px');
}
}

var oX=parseInt(d.style.left),oY=parseInt(d.style.top),eX=xy(e),eY=xy(e,1),tX,tY,stop;

document.onmousemove=drag;
document.onmouseup=function()
{
stop=1;
document.onmousemove='';
document.onmouseup='';
};
}

//used for pop-up div
function pop(div)
{
document.getElementById(div).style.display='block';
return false
}
function hide(div)
{
document.getElementById(div).style.display='none';
return false
}


Also, here is the HTML:


<a href="#" onclick="return pop('myDiv2')">Pop-up div #2</a> - Hidden div shows upon clicking this link, but it won't drag

<div class="bubble" onmousedown="dragOBJ(this,event); return false;">
<div id="myDiv2" class="parentDisable">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<p><a href="#" onClick="return hide('myDiv2')">Close [X]</a></p>
</div>
</div>


And the CSS:



.parentDisable {
position:absolute;
margin:120px;
padding:20px;
width:400px;
display:none;
z-index:3;
background-color:#DEDEDE;
border:1px solid #DEDEDE;
border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;
}

.bubble { position:fixed; width:400px; top:150px; left:250px; cursor:move; }

ryzer
08-30-2011, 09:19 PM
Anybody? :confused:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum