Image Panning Control
Hi, I readed the interactive image pan tutorial and thought it was great and I have a favor to ask. I have this project and I want the background image to pan when the mouse moves, the problem is that I have a menu and I want the buttons to go to different places on the image when I click on them and then the pan stops when the image reachs itīs destination. I also have a button that I want to use to restart the Image panning. Hereīs an example of what I try to do: http://sendyourstyle.com/index.html but without the zoom effect. If someone knows how to do this with Action Script, please let me know. Thanks in advance. Izfact.
KirupaForum > Flash > ActionScript 1.0/2.0
Posted on: 05-06-2008, 12:00 PM
View Complete Forum Thread with Replies
See Related Forum Messages: Follow the Links Below to View Complete Thread
Image Panning Control
Hi, I readed the interactive image pan tutorial and thought it was great and I have a favor to ask.
I have this project and I want the background image to pan when the mouse moves, the problem is that I have a menu and I want the buttons to go to different places on the image when I click on them and then the pan stops when the image reachs itīs destination.
I also have a button that I want to use to restart the Image panning.
Hereīs an example of what I try to do: http://sendyourstyle.com/index.html but without the zoom effect.
If someone knows how to do this with Action Script, please let me know. Thanks in advance.
Izfact.
Help With Panning An Image
Hi,
In my movie, a user can pan a map image left, right, up and down. I have made buttons for each direction and they continuously scroll when the mouse is over the button. At the moment the map (movie clip called "map") keeps scrolling until it disappears off the movie but I would like the map to stop when the edge of the map reaches the end of the display area.
The movie size is 550px (width) by 520px (height). The map size is 519.9 (height) by 746.8 (width) and the dimensions are -9.7x (left), -195.1y (up), 510x (right) and 551.7y (down). I have a display area with the following dimensions 48.3x (left), 40.6y (up), 497.7x (right) and 434.6y (down). I only want the map to appear when it is in the display area.
The ActionScript code that makes the map scroll continuously is the following:-
setProperty ("/map", _y, Number(getProperty("/map", _y))+18);
x_value = getProperty("/map", _x);
y_value = getProperty("/map", _y);
I want the left map edge (-9.7x) to scroll across to the right but only as far as the left display area edge (48.3x) and then to stop scrolling. Does anyone know how to do this??? I have tried with some if statements but nothing has worked. Also, is _x the x value taken from the left or the centre???
Hope someone can help me!!
Panning Image With AS
I am using the following code to pan an image based on the mouse position. All works fine except I want the image to slide to the correct position with easing if you move the mouse off of the stage and then reenter the mouse in a different position from when you left. Right now, what it does is snaps to the mouse instead of sliding to it.
Code:
_root.createEmptyMovieClip("holder", 1);
holder.attachMovie("image", "image", 1);
holder._x = 0;
holder._y = 0;
slope = (Stage.width - holder._width)/Stage.width;
vertSlope = (Stage.height - holder._height)/Stage.height;
curXPos = holder._x;
curYPos = holder._y;
_root.onMouseMove = function(){
_root.onEnterFrame = function(){
_root.holder._x = slope*_xmouse;
_root.holder._y = vertSlope*_ymouse;
curXPos = _root.holder._x = slope*_xmouse;
curYPos = _root.holder._y = vertSlope*_ymouse;
trace("x:" + curXPos);
trace("y:" + curYPos);
delete(this.onEnterFrame);
}
}
Can somebody take a look or give me an idea as to how I can make it slide to the mouse from the images current position with easing instead of snapping to it? Any help is greatly appreciated.
[CS3] Image Panning HELP
Hi,
here's my file :
http://www.muellerdesign.com/aftp/te...ate-Dv1.0.html
so I have sort of have an image reel than pans on mouse move and when you roll over on the image a white box pops in.
Each photo is an button that makes up 1 movie clip on the main timeline that gets controlled by a script on the main timeline also
here's what I want to happen:
I was hoping that when I roll over those white boxes that pop in, the main movie clip will go to a specific place on the stage (with easing) and the panning script on mouse over will be disabled until I roll out.
I'm a total newbie, and this is way too complicated for me, but i have to do it.
pls help:
here's the script for the panning
this.onMouseMove = function() {
constrainedMove(MC,5, 1);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/Stage.width;
var mSpeed:Number;
if (dir == -1) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
}
};
}
stop();
here's an actionscript for making movie clips move with ease to s specific place on the stage
onClipEvent (enterFrame) {
xMC = getProperty(_root.MC, _x);
moveMC = _root.xTargetMC - xMC;
setProperty(_root.MC, _x, yMC + (moveMC/10));
}
is there a way to combine these???? sorry im losing my mind.
HELP!
Image Panning
Hello,
how do get this effect?
http://www.theboondockstv.com/
http://game.timezero.ru/game.ru.html
thanks
Panning Image Help
Hello
Im having a bit of trouble on the panning image im working on. Theres a couple things I wanna do to it but im not quite sure how. Im useing partial code form the infinate menu tutorial but added a y axis onto it. Im working with a really big image so Instead of making the image infinate, how would I set up boundries so that the image could scroll to a certain point and then stop when it reaches the end. the map movie code is just this.
onClipEvent (load)
{
xcenter=350;
ycenter=200;
speed=1/20;
}
onClipEvent (enterFrame)
{
var distance=_root._xmouse-xcenter;
_x+=(distance*speed);
var distance=_root._ymouse-ycenter;
_y+=(distance*speed);
}
I also wanted to make it so the camera zooms in at certain points on the image. Any help is very much appreciated as always.
Thanks in advance,
Zach
Panning Image
Hi, I need help with panning an image. I already made the panning but I cant stop the image when it reach the border of the mask. I look for tutorials in other sites and haven't found anything
If some one want to see my .fla here it is:
www.ebsolutions.ws/imagepanning.fla
Thank you
IMAGE PANNING :-(
Hello,
Can someone please give a tutorial or code for image panning, the same as this one http://www.kirupa.com/developer/flas..._image_pan.htm but for FLASH MX 2004
Really, really want this one.
Thanks.
2D Image Panning
Can anyone tell me how this was done, or what might all be involved for that matter in creating it? Would you say it's all 2D? Any advice would be great appreciated!
http://www.scifi.com/eureka/
Thanks!!
Image Panning Help
I am currently working a piece in flash the utilises the great tutorial (right here on Kirupa) for image panning.
What i want to be able to do is create a left and right button the controls the panning of the image rather than the mouse.
I would be greatly greatful if some kind soul could point me in the right direction of how to achieve this!
Star*
Image Panning
Hi there i am in desperate need of some help (project due in next week! ahh). Basically i found the image panning tutorial on this website, http://www.kirupa.com/developer/flas..._image_pan.htm which is almost perfect however its not working exactly how i need it to work.
i need it to work exactly like it does in the link below!
http://mediaweb.aib.ac.uk/fdashow08/...web/index.html
the reason they differ is because the image pans left and right from the centre of the animation window which i need it to do, but in kirupas you will notice, if you put ur cursor in the middle of the image, its not still it is moving at 100mph to the right. I need the image to be perfectly still when the cursor is the middle of the image. Im struggling to explain this but i hope someone understands!
If anyone can help ill be forever grateful
thankyou all
Image Panning
I know how to do the action script for the image pan. My problem is that I am loading a movie with a stage size of 100 w 50 h into a stage size of 200 w 100 h. When the smaller movie loads into the bigger one, the image begins to pan from left to right when I move my mouse from left to right. However since this stage size is bigger, even if I place my mouse at the top of the stage, the image still pans once I move my mouse from left to right. HOW CAN I CONSTRAIN THE IMAGE FROM PANNING FROM WITHIN A 100 W BY 50 H AREA?
Image Panning Help..
I just had a look at the image panning tutorial, is there a way that this can be modified so that when for example clicking on a button within the scrolling movieclip the panning stops and something else happens and then when the button is clicked again or when an animation finishes we can activate that panning again when the user moves his mouse....?
Image Panning
Hello everyone
i need to design a website for someone, and i am a total beginner in matters of coding, so i apologize for possible blindness to obvious things.
i am having a great difficulty to create a simple code for image/mc panning with an easing effect. there's a tutorial here for doing this in as2, but nothing similar for as3.
i tried to write a very simple code, there it is
Code:
stage.addEventListener(MouseEvent.MOUSE_MOVE,mur)
function mur(e:MouseEvent):void {
sq.x=stage.stageWidth -mouseX;
}
but i got stuck on thinking how to add easing=> how to slow down and stop when reaching the mc's edge? to see the swf, click here
so i searched the web and found this code, but, as you'll see if you'll follow the link below, for some reason it all trembles weirdly, and i dont know how to make it smooth.
Code:
function panImage(E:MouseEvent):void {
var target:MovieClip = bg_mc;
var mousePercent:Number = mouseX/stage.stageWidth;
var mSpeed:Number;
var dir:Number = 1;
target.cacheAsBitmap = true;
if (dir == 1) {
mSpeed = 1 - mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target.width-stage.stageWidth)*mSpeed));
target.addEventListener(Event.ENTER_FRAME, del);
}
function del(E:Event):void {
var speed:Number = 2;
var myMovie:MovieClip=MovieClip(E.target);
if (myMovie.x == myMovie.destX) {
borra(myMovie);
} else if (myMovie.x>myMovie.destX) {
myMovie.x -= Math.ceil((myMovie.x-myMovie.destX)*speed/100);
} else if (myMovie.x<myMovie.destX) {
myMovie.x += Math.ceil((myMovie.destX-myMovie.x)*speed/100);
}
}
function borra(cual) {
cual.removeEventListener(Event.ENTER_FRAME, del);
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, panImage);
for crystal clearness, the rectangle in the swf is instantiated as "bg_mc".
to see the swf, click here
please please help me out, with either of the codes, my dinner depends on it
PS.
if somebody could also tell me how to control the amount of panning (speed) to mouse
movement ratio i'd be eternally grateful..
thanks,
michael
Panning Image Help
Hello
Im having a bit of trouble on the panning image im working on. Theres a couple things I wanna do to it but im not quite sure how. Im useing partial code form the infinate menu tutorial but added a y axis onto it. Im working with a really big image so Instead of making the image infinate, how would I set up boundries so that the image could scroll to a certain point and then stop when it reaches the end. the map movie code is just this.
onClipEvent (load)
{
xcenter=350;
ycenter=200;
speed=1/20;
}
onClipEvent (enterFrame)
{
var distance=_root._xmouse-xcenter;
_x+=(distance*speed);
var distance=_root._ymouse-ycenter;
_y+=(distance*speed);
}
I also wanted to make it so the camera zooms in at certain points on the image. Any help is very much appreciated as always.
Thanks in advance,
Zach
Panning Image
Hi, I need help with panning an image. I already made the panning but I cant stop the image when it reach the border of the mask. I look for tutorials in other sites and haven't found anything
If some one want to see my .fla here it is:
www.ebsolutions.ws/imagepanning.fla
Thank you
Image Scrolling/panning?
I want a line of objects that go well off the stage and have a mask, so only 1 object can be seen at a time. and when you use a scroll bar or click on a link say 1-10 to get to what object you want to.
say: 1 2 3 | 4 | 5 6 7 8 9 10
then you click 9
1 2 3 4 5 6 7 8 | 9 | 10
the brackets represent what is view able in the scene but when it scrolls from 4 to 9...you see the inbetweens scrolling through it on the way from 4 to 9 so you can see 5 6 7 8 scroll through the "window" ....
Panning Across An Image In Flash?
I have a landscape image I wish to pan across in flash.
I have set my movie
window size to 550x300 pixels.
I have saved the landscape image as 1100 x 600 pixels.
How do I do it?
[F8] Image Panning & Communicating Two .swf's
Hi!
I have some serious troubles with AS, maybe somebody would be kind enough to help me or at least give me some hints, as I am stuck with my personal website since last week and can't move on
First problem: I am trying to do MC panning from left to the right and the other way around. I used and slightly modified tutorial from kirupa.com:
http://www.kirupa.com/developer/flas..._image_pan.htm
It's working pretty well but MC pans no matter where you point the mouse cursor - whether the mouse is over MC or not. It pans that movie clip all the time. I would like it to move only when the cursor is over the MC. Could anyone have a look at my .fla file and give me some hint how to do that? You can download .fla from here:
http://spoon.unspl.com/imagePan_3.fla
And my second question: How can you communicate two .swf files, in such a way that e.g. file "1.swf" pass some action script to file "2.swf" that is then executed in "2.swf". Let say that when frame 20th is played in file 2.swf, then in file 1.swf background colour changes. I've tried many different tutorials but still can't make that working.
Please, I need your help!
Panning Image Not Working Right, HELP
HELP!
So I have an image that pans onMouseMove, several things happen
onRelease= it attaches a movieclip and play (this works)
Problem:
I want the attached movieclip to be removed when I roll-out the hit area and continue panning. It kind works but the when I pan from hit area to outside hit area the panning stops and I have to move the mouse around for it to work, it's weird I dont know what I'm doing wrong pls, help!
I attached the swf file for the animation.
and hover over on the first to 2nd photo. I just applied the code to those.
here's my code
// panning code
stop();
var _MAIN:MovieClip = this;
var isSelected:MovieClip = null;
var canPan:Boolean = true;
MC._x = locX;
//
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/bg._width;
var mSpeed:Number = mousePercent*dir;
target.destX = Math.round(-((target._width-bg._width)*mSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX || target._x>0 || target._x<bg._width-target._width) { delete target.onEnterFrame;
if (target._x>0) {
target._x = 0;
} else if (target._x<bg._width-target._width) {
target._x = bg._width-target._width;
}
} else if (canPan) {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
} else {
delete target.onEnterFrame;
}
};
}
// load movie clip code
function doPress(btn) {
canPan = !canPan;
if (!canPan) {
isSelected = _MAIN.attachMovie(btn._name, btn._name, 1, {_x:0, _y:0});
} else {
isSelected.removeMovieClip();
MC._x = locX=0-(btn._x);
}
}
MC.btn_A.onPress = function() {
doPress(this);
};
//code on hit areas
//this part doesnt really work smoothly
MC.btn_A.onRollOut = function() {
canPan = !canPan;
!canPan == true
isSelected.removeMovieClip();
};
MC.btn_B.onPress = function() {
doPress(this);
};
MC.btn_C.onPress = function() {
doPress(this);
};
MC.btn_D.onPress = function() {
doPress(this);
};
_MAIN.onMouseMove = function() {
constrainedMove(MC,4,1);
};
HELP! thanks a lot!
Zooming And Panning An Image
I have loaded an image from a particular site using loader.. and added this loader in a Movieclip.. I want to zoom and pan the image.. How to zoom particular area of a movieclip?
Multiple Image Panning
Hi. I saw the Interactive Image Panning tutorial (great one) and i whould like to know what modifications can be made on the tutorial actionscript in order to pan more than one image. Actionscipt isnīt my cup of tea, so you will have to bare with me
I whould apreciate the help...
thanks
Image Panning Problem
Hi
I have been using the code from Krilnon image panning tutorial :http://www.kirupa.com/developer/flas..._image_pan.htm.
Seem to be have a problem setting different co-ordinates than a 0,0 xy.
Basically what is happening is when i position the movie to a x position of 179px, the image scrolls, but i need to move to 0px to see the edge of the image - i need to be able to roll over the people in the image to view info, but on scrolling back right to left, the image does not reset to 179px position. here is an example of it:
http://www.origin.ie/imagepan
Any suggestions would be greatly appreciated.
Mick
Panning Image Question
hey guys, i have a question. I'm looking to create a panning image controlled by two buttons spanning the height of either side of the workspace. i found this turorial http://www.kirupa.com/developer/flas..._image_pan.htm which is similar, however i want to put buttons in the movie and it would be rather hard to click on a button if youre chasing it around the screen. So basically i want to be able to scroll the image like that, but to have the scrolling controlled by two rollerover buttons, one of the left scrolling the image left, and the right to the right. The only thing is, i want to be able to do this and have it stop at the edge of the background so that it wont keep going indefinitely showing a blank screen. If anybody can point me in any direction, i would be insanely appreciative. Thanks, everyone
Interactive Image Panning
I just read the tutorial for the Interactive Image Panning. I am using this code for a starting point for a navigation menu that is being masked. I am want the menu to scroll only when the mouse is over the masked area. I have found many references to scrolling menus but they all scroll with the stage and not just the menu area.
Anyone have any tips for doing this?
Interactive Image Panning
Hello
First of all let me start by saying how wonderful this site is.
I was in the neighborhood and loved this tutorial.
---> http://www.kirupa.com/developer/flas..._image_pan.htm <---
I was wondering if anyone could tell me if it would be possible to add a simple button to this movie. I wanted to see if I could add a second image to upload once the first one was clicked on.
Ive tired to add a simple scene script but it will not budge. If anyone has any input relating to this tutorial would be a great help. Or if anyone knows of simpler way of doing this would be helpful as well.
on (release) {
gotoAndStop ("Image2", 1);
}
-
Interactive Image Panning
Hi,
http://www.kirupa.com/developer/flas...image_pan3.htm
I was looking at the tutorial for the above and found it very useful, but I wanted to get the scroll working for the vertical axis aswell as just the horizontal. I'm a bit of a novice when it comes to AS so I thought I could pretty much just copy the code for the x axis and change all the X's to Y's. However this didn't work. Does anyone have any advice as to what I should be doing? Much appreciated.
Interactive Image Panning
Hi, I have just completed your tutorial on interactive image panning (http://www.kirupa.com/developer/flas...image_pan3.htm), however i have a couple of question i was hoping someone might be able to help me with:
1. when i move the mouse, the image scolls the opposing direction; in the tutorial the image scrolls with the mouse...? i pasted the code from the page,so i'm unsure what the solution might be...
2. I would like to be able to scroll the image on the x and y axis; both up and down/left and right, and was wondering how to modify the code to do this; is it possible to capture whether the mouse is moving left or right with an event listener, or is there some other way of doing this?
any help would be much appreciated, thanks!
Image Panning In Nested MC
I am using the Image panning script from one of Kirupa.com's tutorial. The instance name of the MC on stage is , contentMC, now what I want to do is I want this "Image panning" script to work which is inside my contentMC, called, glMC (contentMC -> glMC). The AS is not working, I have tried to change the acquiring values to _parent, but to no avail. Where am I going wrong?
Here's the AS:
this.onMouseMove = function() {
constrainedMove(glMC, 4, 1);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _parent._xmouse/Stage.width;
var mSpeed:Number;
if (dir == 1) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else if (target._x>target.destX) {
target._x -= Math.ceil((target._x-target.destX)*(speed/100));
} else if (target._x<target.destX) {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
}
};
}
Image Panning Gallery - Help Please
Hi,
I have just found this forum today and boy am I glad I did!
I have done the tutotrial "Interactive Image Panning", and have applied it to a gallery I am trying to create, but I can't get the scrolling to stop when the gallery reaches the edge of the stage - can someone please help?
fla is uploaded here
http://www.fili.com.au/mens-new3.fla
Thankyou!
Image Panning Question
I had tried the image panning tutorial and i have some question with it bcoz i m begginer of AS. Can anyone clear d question marks in my mind? First below is the code and explaination for it. The red colour words are my questions.
/*The below section of code registers an onMouseMove event handler. Whenever the mouse moves, any code contained within the this.onMouseMove function will be executed. The code that is executed is the function call constrainedMove(bg_mc, 4, 1); constrainedMove(target, speed, dir)
*/
this.onMouseMove = function() {
constrainedMove(bg_mc, 4, 1);
};
/* Declaring a new function called constrainedMove. It takes in three arguments - target, speed, and dir. Notice that I define their types as MovieClip, Number, and Number.
*/
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
/*The mousePercent variable stores a fraction of your mouse's X position with regards to your total stage width. This number varies between 0 and 1, and as you will see later, it helps dampen or speed up how fast your image scrolls to its boundary.
*/
var mousePercent:Number = _xmouse/Stage.width;
/*The mSpeed variable either stores the value stored by your mousePercent variable or it reverses the value in your mousePercent variable. Depending on what value you pass in for the dir variable, your mousePercent value will be either mousePercent or 1 - mousePercent.
What this essentially does it reverses the movement of the image scroll based on your mouse movement. For example, when the dir value is 1, your image pans in the same direction as your mouse movement. If the dir value is anything besides 1, then the mouse
movement and the image panning work in opposite directions.
*/
var mSpeed:Number;
if (dir == 1) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
/*The destX variable stores the X position of our image. This line of code is designed to ensure that no matter where the mouse is, as determined by the mousePercent variable stored in mSpeed, that your image will not go beyond either the left-most or right-most
boundaries. One way you can think about this is that, mSpeed is either (1 - mousePercent) or mousePercent. Either way, mousePercent is _xmouse/Stage.width. When you expand this out, for example when dir = 1, your destX variable can be simplified as:
-(_xmouse * (target._width - Stage.width) / Stage.width)
As your mouse position moves, your value for destX changes. What this does, as you will see shortly, is that it sets the final destination for where your image needs to scroll. When you are panning, you would have noticed the image movement is not immediately responsive to your mouse movement. There is a gradual acceleration and deceleration as the image moves to its destination. The destination is what the above destX value finds for you.
*/
Why target._width - Stage.width? Cant target._width just multiply with mSpeed?
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
/*If your image position, target._x, is less than or greater than your destX variable, then you need to move in the appropriate direction to make sure that the difference between where you are and where you should be as specified by the destX variable is
reduced to zero. In other words, your goal is to have both your current position and
the position stored by destX to be the same so that you end the enterFrame by reaching target._x == target.destX.
*/
target.onEnterFrame = function() {
if (target._x == target.destX) {
sorry, i know is a dumb question, is the code blow means stop running d coding in frame?
delete target.onEnterFrame;
} else {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
}
};
}
And last question. can this image panning only when d mouse pointer is moving inside then image itself? The image from tutorial is panning when ur mouse pointer is at anywhere in d stage. Let say we make d stage size bigger than the image and we wan to make d image only panning when d mouse pointer is moving in image area. Anyone know how to do it? Plz let me know if you know. Thank you.
Interactive Image Panning
http://www.kirupa.com/developer/flas..._image_pan.htm
Hello, i have a question here.
I dont want to pan the image within the Stage size.
i want to pan the image within a masking. so that i can adjust the width & height anytime.
Can anyone show me how to change the script?
thanks.
Panning Image = Choppy?
I'm trying to move an image that is a sort of widescreen image from one of the stage to the other side - when played back in .swf form it appears very choppy - is there a way to stop this from happening? (this is for a presentation not the web)
Thanks!
Boon.
Help Flash Image Panning
I am currently developing a pixel and I would like the user to be able to pan around the city.
I think the easiest way of doing this is to have a very large image (3500px by 3000px) and four buttons, one at the top, bottom, left and right. I would love it that when the user hovers over the button the screen/stage will move in the direction of the button. for example when the user hovers over the left button flash will move the image to the right so the screen will move left.
Please help I have made most of the pixel designs, I just don't know how to do this, could someone point me in the way of a tutorial or something.
Thank You
Big J
Interactive Image Panning
Hey all, I'm new here! And I've got a reason for that. I've been looking for a Flash component/tutorial I can use to make an interactive map. Now I've found the tutorial Interactive Image Panning here at Kirupa.
In that tut you go with the mouse to the right, and the image floats to the left...but here's the problem/question: I also want to get the image float to the bottom/top, when the mouse goes to top/bottom...
Can anyone help me with that? If, of course, you know what I mean by this unclear message
mane.
Image Panning - Stopping?
I built out a Flash file with the help with Kirupa's image panning script: http://www.kirupa.com/developer/flash8/interactive_image_pan3.htm
Anyhow, everything is working great, but I've added some on release nav items that overlay the panning motion. Ideally I'd love to have the overlays, when activated, stop the mouse movement altogether. I checked out some examples via Google, and I *think* it's possible, I just have no idea where to start.
Here is my image panning code:
Code:
this.onMouseMove = function() {
constrainedMove(bg_mc,4,90);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/Stage.width;
var mSpeed:Number;
if (dir == 1) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed-3000));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else if (target._x>target.destX+5) {
target._x -= Math.ceil((target._x-target.destX)*(speed/400));
} else if (target._x<target.destX) {
target._x += Math.ceil((target.destX-target._x)*(speed/400));
}
};
}
Any help / insight is really appreciated!
Vertical Image Panning?
Hi there, I'm a bit slow with Flash, so forgive me if I'm a complete idiot with this stuff.
Okay, I followed the Interactive Image Panning tutorial here on Kirupa (great place btw) and it works great horizontally, but I'm a bit confused when trying to do it vertically. I changed so far everything from x to y and width to height, but it seems that when I test the movie, and scroll down, the image completely scrolls by, leaving what's left, which is white. Why won't it stop at the edge of the image like the horizontal version?
this is what I have at the moment:
Code:
this.onMouseMove = function() {
constrainedMove(bg_mc, 4, 1);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _ymouse/Stage.height;
var mSpeed:Number;
if (dir == 1) {
mSpeed = mousePercent;
} else {
mSpeed = mousePercent;
}
target.destY = Math.round(-((target._width-Stage.height)*mSpeed));
target.onEnterFrame = function() {
if (target._y == target.destY) {
delete target.onEnterFrame;
} else if (target._y>target.destY) {
target._y -= Math.ceil((target._y-target.destY)*(speed/100));
} else if (target._y<target.destY) {
target._y += Math.ceil((target.destY-target._y)*(speed/100));
}
};
}
Interactive Image Panning
Hi ,
I tried working with this effect :
http://www.kirupa.com/developer/flas..._image_pan.htm
It works fine when we use it as single file but suppose I load the same file into another file, it doesn't work fine especially if I load 2 such movies in a movie.
Any help would be really appreciated.
Thanks
Yogendra
Help With Interactive Image Panning..
Hi I've been following the tutorial on the site for interactive image panning, but i would like to be able to pan both on the x and y axis, i've been trying various things but with no luck, can anyone point out how i go about adjusting the code to do X & Y?
do i need to create a whole new function fo the Y or can i incorporate it into the current code.
help is great;y appreciated
Code:
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/Stage.width;
var mSpeed:Number;
if (dir == 0) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else {
target._x += Math.ceil((target.destX-target._x)*(speed/18));
}
};
}
thanks for your help
bo
Interactive Image Panning
Hi.
I've acted upon your tuturial here and even added the Yscale to make it more fluent, but I lack flexibility in mouse movement.
Here's the link to what the image is supoosed to move like:
http://bedtimestoryband.com/test/vlab/01/index.html
and mine moves and kinda gets stuck:
http://www.spice-e.net/samples/vlab/vlab.html
This is the code in the flash:
this.onMouseMove = function() {
constrainedMove(bg_mc, 15, 1);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/Stage.width;
var mouseYPercent:Number = _ymouse/Stage.height;
var mSpeed:Number;
if (dir == 2) {
mSpeed = 1-mou0.sePercent;
} else {
mSpeed = mousePercent;
}
var mYSpeed:Number;
if (dir == 2) {
mYSpeed = 1-mouseYPercent;
} else {
mYSpeed = mouseYPercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
target.destY = Math.round(-((target._height-Stage.height)*mYSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else if (target._x>target.destX) {
target._x -= Math.ceil((target._x-target.destX)*(speed/100));
} else if (target._x<target.destX) {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
}
if (target._y == target.destY) {
delete target.onEnterFrame;
} else if (target._y>target.destY) {
target._y -= Math.ceil((target._y-target.destY)*(speed/100));
} else if (target._y<target.destY) {
target._y += Math.ceil((target.destY-target._y)*(speed/100));
}
};
}
Thanks for the help
Galia
Interactive Image Panning
There is an Interactive Image Panning tutorial on Kirupa.
I was curious if anyone knows how to get this to pan the X and Y rather than just along the X axis.
In other words, any mouse direction you move would move the image, the same way or the opposite way.
Panning Image, But With Buttons
okay so I used the image panning tutorial to achieve and effect that I have been trying to accomplish for a while now.(ty)
The last part of the puzzle is to take the image mc and use a bunch of buttons instead. so in effect i have a horizontal "wheel of fortune" type menu. The issue I am having is that i need the mouse movement to get triggered and "scroll/pan" the series of buttons and then let the buttons settle. Right now it is very difficult to select a different button without quite a bit of effort.
please let me know if you have any ideas.
Image Panning On Load
Hi
Ive created a new flash movie that pans an image when you move the mouse over it.
The problem I have is that I would like the movie to pan from right to left when the flash movie loads then pan in any direction when the mouse moves over it.
How would I modify the following code to do that?
this.onMouseMove = function() {
constrainedMove(bg_mc, 4, 1);
};
function constrainedMove(target:MovieClip, speed:Number, dir:Number) {
var mousePercent:Number = _xmouse/Stage.width;
var mSpeed:Number;
if (dir == 1) {
mSpeed = 1-mousePercent;
} else {
mSpeed = mousePercent;
}
target.destX = Math.round(-((target._width-Stage.width)*mSpeed));
target.onEnterFrame = function() {
if (target._x == target.destX) {
delete target.onEnterFrame;
} else {
target._x += Math.ceil((target.destX-target._x)*(speed/100));
}
};
}
Many Thanks
Bilbo
Interactive Image Panning
Hey.
So, I've been looking on just about every Flash resource web site I know (and found a couple that I didn't know of, and some I wish I didn't find) for a solution to a problem I've got with a project I'm busy on. The idea is to create a fake 3D space with several layers of images seemingly on top of one another, all of which correspond with the mouse's position at different speeds. Yeah, that doesn't make sense to me either. Look at http://www.saintsandsoldiers.com/ and enter the main web site to see what I'm trying to recreate. We have a background of clouds, moving extremely slowly. Some mountains on top of that, moving faster. The soldiers are layered in front, also moving at variable speeds to give the desired 3D effect, without actually using a 3D environment (which I've already wasted tons of cash on). I've followed the image panning tutorial on Kirupa's site, and along with some other source files I found all over, I did get something close to what I'm aiming for. The thing is that some items at the front need to act as buttons or animations, and I will need to able to control the other objects' position on the stage. For example - we've got three people moving around on the front of the stage, and when I click on the one at the right, the two on the left slide to the left even more to make some space for an animation in between them and the one on the far right. While this sounds overly complicated, I've seen it done, and I know someone here is brilliant enough to know what I mean :) So if anyone has any help with this issue, I would be eternally grateful. Unfortunately, I'm not allowed to upload my source files, but any help in getting elements to move around the screen relative to the mouse, but also to predefined positions, would really save my life ...
Panning Image With Actionscript
Hi -
I hope you can help! I've been trying to copy and paste this actionscript from the Flash help pages to pan an image with actionscript although i can't get it to work!
http://livedocs.adobe.com/flash/8/ma...=00001495.html
Is it because i'm using Flash 8? Or is the script wrong!
Thanks
Interactive Image Panning
Hi guys
having troubles with this tutorial
http://www.kirupa.com/developer/flas...image_pan3.htm
how can i apply this to different movieclips?
i used the same code, only replaced the movieclip name and it only works on 1 movieclip
AS 2 Image Panning Refined ?
Hi everyone, I am very happy I found this http://www.kirupa.com/developer/flas..._image_pan.htm, its very close to what I hope to accomplish. What I am trying to accomplish is basicly a sliding menu that gives me control over the rollout and rollover animation of movie clips within it. ThumbnailerPro is a perfect example of what I am trying to do and I would use it but cant do to certain limitation is has so here I am working with this option too have a bit more raw control. Currently Kirupa's file moves the panning clips position relative to the width of the document and where the mouse is currently on it. The problem is I want the scrolling of the clip to be related to a certain area of the stage width instead of the entire stage width. In this case its the area being masked. Is there a way to load my menu swf into another document with a larger stage width and keep it from adopting the new stage width as its srolling area? Or better yet link the clips scrolling position to a movie clips position/width instead of the stage width? Hopefully that is clear enough, I have also uploaded my files so you have a visual of what I am looking to accomplish. Thanks for your help in advance.
http://designlabwest.com/scrollingnav.html
http://designlabwest.com/scrollingnav.zip
Help - Interactive Image Panning In AS3
Hiya, I am trying to implement the interactive image panning script tutorial from this site into my AS3 movie. The problem is that the image I want to pan is contained in a masked movieclip which has a width smaller than the stage.
I have no problem translating the script in the tutorial into AS3, however I'm having trouble setting the bounds of movement so that it's constrained to the mask's position and width.
Does anyone care to take a look at my simple flash file and help me with making this work?
|