Join for FREE | Take the Tour Lost Password?
[x]

deviantART

 
©2008-2010 ~MaskedMarvel
:iconmaskedmarvel:

Artist's Comments

Well, I promised it, so here it is.

Toss this Actionscript into Flash with a background movie clip called 'background' (creative huh?), and you'll be able to scroll around with your mouse to your hearts content.

Making this tutorial was actually useful for me as well. While I was trying to explain myself and simplify the code as much as possible, I found new ways to do different things that made things much easier. So what you see is the 'refined' version of the mouse movement, not the hack job I made before.

As with all my tutorials (2 so far) play with them and feel free to use them in whatever you make.

Enjoy!

ONLINE EXAMPLE (be patient as it loads because there is a large background image)

ACTIONSCRIPT:
// Variables
var mousePositionX:Number = 0;
var mousePositionY:Number = 0;
var speedX:Number = 0;
var speedY:Number = 0;
var edge:Number = 125;
var scrollDivide:Number = 10;

// Event listener for movement.
stage.addEventListener(Event.ENTER_FRAME, calculate);

// Function for moving.
function calculate(Event) {
mousePositionX = mouseX;
mousePositionY = mouseY;
// Left edge.
if (mousePositionX >= 0 && mousePositionX < edge && mousePositionY >= edge && mousePositionY < (stage.stageHeight - edge)) {
speedX = (edge - mousePositionX) / scrollDivide;
background.x = Math.min(background.x + speedX, 0);
}
// Top left.
else if (mousePositionX >= 0 && mousePositionX < edge && mousePositionY >= 0 && mousePositionY < edge) {
speedX = (edge - mousePositionX) / scrollDivide;
speedY = (edge - mousePositionY) / scrollDivide;
background.x = Math.min(background.x + speedX, 0);
background.y = Math.min(background.y + speedY, 0);
}
// Top edge.
else if (mousePositionX >= edge && mousePositionX < (stage.stageWidth - edge) && mousePositionY >= 0 && mousePositionY < edge) {
speedY = (edge - mousePositionY) / scrollDivide;
background.y = Math.min(background.y + speedY, 0);
}
// Top right.
else if (mousePositionX >= (stage.stageWidth - edge) && mousePositionX < stage.stageWidth && mousePositionY >= 0 && mousePositionY < edge) {
speedX = (mousePositionX - (stage.stageWidth - edge)) / scrollDivide;
speedY = (edge - mousePositionY) / scrollDivide;
background.x = Math.max(background.x - speedX, stage.stageWidth - background.width);
background.y = Math.min(background.y + speedY, 0);
}
// Right edge.
else if (mousePositionX >= (stage.stageWidth - edge) && mousePositionX < stage.stageWidth && mousePositionY >= edge && mousePositionY < (stage.stageHeight - edge)) {
speedX = (mousePositionX - (stage.stageWidth - edge)) / scrollDivide;
background.x = Math.max(background.x - speedX, stage.stageWidth - background.width);
}
// Bottom right.
else if (mousePositionX >= (stage.stageWidth - edge) && mousePositionX < stage.stageWidth && mousePositionY >= (stage.stageHeight - edge) && mousePositionY < stage.stageHeight) {
speedX = (mousePositionX - (stage.stageWidth - edge)) / scrollDivide;
speedY = (mousePositionY - (stage.stageHeight - edge)) / scrollDivide;
background.x = Math.max(background.x - speedX, stage.stageWidth - background.width);
background.y = Math.max(background.y - speedY, stage.stageHeight - background.height);
}
// Bottom edge.
else if (mousePositionX >= edge && mousePositionX < (stage.stageWidth - edge) && mousePositionY >= (stage.stageHeight - edge) && mousePositionY < stage.stageHeight) {
speedY = (mousePositionY - (stage.stageHeight - edge)) / scrollDivide;
background.y = Math.max(background.y - speedY, stage.stageHeight - background.height);
}
// Bottom left.
else if (mousePositionX >= 0 && mousePositionX < edge && mousePositionY >= (stage.stageHeight - edge) && mousePositionY < stage.stageHeight) {
speedX = (edge - mousePositionX) / scrollDivide;
speedY = (mousePositionY - (stage.stageHeight - edge)) / scrollDivide;
background.x = Math.min(background.x + speedX, 0);
background.y = Math.max(background.y - speedY, stage.stageHeight - background.height);
}
// The middle.
else {
}
}

Comments


love 0 0 joy 0 0 wow 0 0 mad 0 0 sad 1 1 fear 0 0 neutral 0 0
:iconxenocide001:
great tutorial dude..
this is like the other tutorial.. just pasting the actionscript in flash.. and should work???... cuz.. i tried to modify the action script in ps3 background tutt.. and i fucked it up

--
pardon for the engrish" XDD
:iconmaskedmarvel:
Yeah, this one is the same. You can simply copy and paste the Actionscript, but with this one you'll need to make a movie clip called "background" that has a really big picture in it at x=0 and y=0. With the PS3 background one you didn't have to do anything but the Actionscript.
:iconkyanos:
THANK YOU!!!

:hug:

--
E viva as festas do Pajama. :heart:
:iconbabychristine:
THAT'S AWESOME!

--
:heart:always,
Christine xx
:blowkiss: take care !
:iconxzentrico:
Thanks dude!! This is gonna help me so much!
:iconzee7:
thanks:)

--
::::::An Idea is only an idea until you make it real::::
:meditation: Proud VIP member of
webgraphix
[link]
DesignersJunior
[link]
Templateartists
[link]
:iconzee7:
hi dude i nee this in actionscript 2.0, or do you have any tutorial link something like this.
looking forword from i really need this.
thanks in advance :bow:

--
::An Idea is only an idea until you make it real::
--- VIP Member ---
webgraphix | webmagic
:iconflashera:
Hii!! this is that I am looking for. THe problem that I need it in AS2

Anybody know that?

Many thanks
:iconweareone:
Online example is broken!

Details

April 22, 2008
630 KB
630 KB
800×3628

Statistics

9
25 [who?]
3,600 (2 today)
300 (0 today)

Share

Link
Embed
Thumb

Site Map