Drag a Flash movie on screen

[gheta]

Hi all,
Forgive me if am not articulate enough in posing this question very well. I need to know how I can drag around a flash .swf popup (500px by 400px) within a browser. Is there any internal coding within flash that makes this possible?
Thanks in advance
gheta

 

[kennethkawamoto]

You can drag around a popup window just the same way you drag around any other window on your screen!

If you mean you want to drag around a layer with a Flash movie in it, that's nothing to do with Flash but that's a DHTML job - here's how.

Say you have a <DIV> contains a Flash movie, which is 500 x 400 px and sitting x:100, y:100 position on top of an HTML page. Let's call it "dragLayer". Clicking on this layer will invoke "startDrag" Javascript function. So, the <DIV> tag will look like this:

[tt]<div id="dragLayer" style="position:absolute; top:100px; left:100px; width:500px; height:400px; z-index:1;" onMouseDown="startDrag(event)">[/tt]

(You may want to set the "wmode" property of the Flash object to "transparent" so that you'll see through the HTML page underneath.)

"startDrag" function will add the event listeners to the document, so that when the mouse is moved the layer will be positioned to where the mouse is (that's "drag", basically), and when the mouse is released it removes event listeners so that the drag stops.

Javascript:
[tt]//
var dragLayer
var offsetX, offsetY
function startDrag(event){
dragLayer = document.getElementById("dragLayer")
offsetX = event.clientX - parseInt(dragLayer.style.left)
offsetY = event.clientY - parseInt(dragLayer.style.top)
document.addEventListener("mousemove", drag, true);
document.addEventListener("mouseup", stopDrag, true);
}
function stopDrag(){
document.removeEventListener("mousemove", drag, true);
document.removeEventListener("mouseup", stopDrag, true);
}
function drag(event){
var x = event.clientX + window.scrollX - offsetX + "px"
var y = event.clientY + window.scrollY - offsetY + "px"
dragLayer.style.left = x
dragLayer.style.top = y
}
//[/tt]

Caveat: the above script is for modern browsers, it won't work for IE (sorry I don't use IE and I'm lazy.) To get this work for IE you have to change few things like use "scrollLeft" instead of "scrollX", and "attachEvent" instead of "addEventListner", but otherwise it's the same.

For more info go to this detailed article:
<

http://www.brainjar.com/dhtml/drag/default.asp>

Kenneth Kawamoto

http://www.materiaprima.co.uk