AS3 Image Carousel
Hi I am trying to replicate the an image carousel like the one on nissanusa.com. I have created a movie(image1) with five layers containing the images.and given them instance names ClipA, ClipB, etc.I then moved ClipA from the top layer to below ClipB but then the listeners dont catch any mose roll over.Any Ideas?Is there a way to dynamically move them up or down layers? image1.clipA.addEventListener(MouseEvent.ROLL_OVER,overFunction1);image1.clipA.addEventListener(MouseEvent.ROLL_OUT,outFunction1);image1.clipB.addEventListener(MouseEvent.ROLL_OVER,overFunction2);image1.clipB.addEventListener(MouseEvent.ROLL_OUT,outFunction1); function overFunction1(obj:Object) {trace ("on roll called");display_txt.text = "CLIP A";bgdark.visible = true;image1.stop();image1.clipA.gotoAndStop(10);image1.clipB.gotoAndStop(20);image1.clipC.gotoAndStop(20);image1.clipD.gotoAndStop(20);image1.clipE.gotoAndStop(20);}ThanksChris
Adobe > ActionScript 1 and 2
Posted on: 05/29/2007 04:39:45 PM
View Complete Forum Thread with Replies
See Related Forum Messages: Follow the Links Below to View Complete Thread
Anyone Know Any Image Carousel Tutorial?
Hi,
I'm looking for an image carousel (rotating like those found in carnival rides) done in Flash5. Preferably horizontally rotating and customizable...
Anyone seen one lately? Somewhat looks like this except this one is done with java applets and is more like a ferris wheel rather than a carousel.
Thanks!
Carousel Image Gallery
i am interested to know how this IMAGE GALLERY was created and worked out.
i searched on FK and found THIS Carousel sorta thing but i was not successful implementing images within it.
anyhelp is greatly appreciated.
I Need An Image Carousel, Scroller Like This One...
Hi there,
Im looking to build a scrolling image carousel like the one shown here
http://www.nikoleramsay.com/
The requirements are:
The images must be loaded in individually to reduce preload time.
For it to be scrolling.
To have a dragable bar
To remain 100% width in any browser.
Does any know of a script, a site, a tutorial that might help me complete this? Doesn’t have to be a free script, i don’t mind paying for this.
To be honest, any help in the right direction would be fantastically helpful here.
Tim
I Need An Image Carousel, Scroller Like This One...
Hi there,
Im looking to build a scrolling image carousel like the one shown here
http://www.nikoleramsay.com/
The requirements are:
The images must be loaded in individually to reduce preload time.
For it to be scrolling.
To have a dragable bar
To remain 100% width in any browser.
Does any know of a script, a site, a tutorial that might help me complete this? Doesn’t have to be a free script, i don’t mind paying for this.
To be honest, any help in the right direction would be fantastically helpful here.
Tim
Carousel Image Quality
Trying to figure out how to make the images in my carousel not jump around so much. Does anybody know of an effect, file type, flash setting or anything else that can help smoooth this out?
Thanks fo the help.
if you want to see what im talking about go here
http://www.symbioticmeg.com
A Static Image To 3D Carousel
I did the fantastic 3D carousel tutorial and got it working properly. I'd like to put a statis picture in the middle of the carousel though, something that the items revolve around, so I'd need the items to go behind the image somehow. I imagine this can be accomplished by a mask but I have no idea how to mask the dynamically created items and now they just move on top of the middle image. Can someone help me with this?
Carousel Tut. Image Instead Of Text
Hi
I am trying to work with the carousel tutorial. It is possible to display text on the right when an icon is clicked. Is it possible to display an image instead of the text (reading from the Xml)?
Henk
Carousel - Foreground Image
What would be the best way to overlay an image on the carousel script. I'm trying to make the icons in the rear pass behind the overlayed image.
Here's an example of what's happening now when I simply place the image on it's own layer.
http://pmgroup.com/ready2go/_caro2/caro ... enter.html
Bug In The Attached Carousel Image Gallery
I need to fix the bug in a carousel based image gallery. I tried to figure it out but I couldn't.
Can anybody help me in this. I would be glad if somebody can explain what's going on in the action script
Carousel Image Gallery Scale
I finished my first design in flsh 8 using autoscript. It is a carousel gallery of 14 images rotating around.
I am very new to this area but i hava a knowledge on programming language.
What i want is when an image comes in the center of the monitor to scale
automatically, stay at the max scale for around 2 secs then scale back to its original size.
when an image is in the proccess of scaling, the other images should stop and wait until the image gets its original size.
actually the proccess goes like that:
1st image in screen center - scale for 2 secs - remain at max size for 2 sec - scale back to original size - carousel rotation -
2nd image - scale.....and so on
Actually what i am lookin for is in url http://www.greekmilitary.net/
I would be very gratefull if anyone can supply me with an appropriate actionscript code or any reference tutorials on this
Best Practices - Flash Image Carousel
When creating an image Carousel in flash for a web page, what are the best practices for loading quickly and changing images?
So for instance, on an ecommerce site, the home page often has a block created in flash in which 4-6 images are included with arrows or image numbers are displayed at the bottom as buttons. The images automatically change to the next ever x seconds unless the user selects an image number or the forward/back arrows.
Obviously, smaller the image the better. But how about best practices for things like:
Do you include one image in the block and then load dynamically the other images? Should all images be dynamically loaded if you want to change them on a daily/weekly basis? Any suggestions for making sure the images, especially the first one is loaded quickly?
Anyone have sample ~gpl code that demonstrates a block like this?
Two examples - kohls.com, jcrew.com
Image In Center Of Carousel Menu?
Hi, I recently built myself a carousel menu that works well, and was just wondering if it was possible to place a movieclip at it's center? the problem i've been having is that the icons at the back still seem to display overtop of the central movie clip, is there perhaps some way to set the depth of the movie clip I want in the center, so that the icons in front pass in front of the movie clip while the ones in back pass behind?
sorry if this is a bit confusing, i've been up all night trying to figure this out =/
thx in adv.
-wraith
3D Carousel Weird Image At Loading?
Hello
The 3d carousel is fantastic but i seem to have encountered an issue
when it loads it has a very odd royal blue blue box about 2 inches tall by half inch wide appear on the screen briefly. this appears in the upper left portion of the screen
any ideas what this might be? would like to make it go away! since it is all loading dynamically i have no idea where this little gremlin is coming from
thanks
justin
Carousel - Image Instead Of Text Upon ROLLOVER
I watched all 3 Carousel tutorials but can not figure out how to use an image instead of dynamic text for the rollover bubble that appears above each icon. I found a few threads on this forum with similar questions but none were answered.
Thanks in advance for your help.
How Can I Load An External Image Using This Carousel Code
I found this beautiful carousel ported to actionscript 3.0.
http://board.flashkit.com/board/atta...7&d=1188450564
How can I change the code so I can click one of the carousel images and have it load the companion large image located in a different folder into a movieclip on stage.
I am a newbie to AS3 and struggling to learn how to do things.
Hopefully, someday I will be smart enough to contribute to the forum with intelligent submissions.
Can't Find A Simple Image Rotator Tutorial (not Carousel)
Hi,
I need to make a simple movie that rotates through images/swfs, in order, and has a small navigation to select any of the images in the rotator. Probably will only contain 3 - 6 images/swfs at a time. I have come across many pre-made flash image rotators, but I need something a bit more open that I can customize to my liking. I'm not necessarily looking for ease of use or automated. I know enough AS that I understand it, I just need help writing it sometimes. Kinda like when you can read a language, but you're not fluent in writing it. Anyway, I'm not asking for someone to write AS for me, but if anyone has something already on hand that they don't mind sharing or if you know of a tutorial that may help, I would appreciate it. Thanks.
Carousel Help
i am creating a Carousel effect (found here: www.gotoandlearn.com), but am not implementing any mouse interaction with it, it is a straight forward loop. i need help in two areas.
Code:
var numOfBalls:Number = 3;
var radiusX:Number = 375;
var radiusY:Number = 100;
var centerX:Number = 400;
var centerY:Number = 400;
var speed:Number = 0.005;
for(var i=0;i<numOfBalls;i++)
{
var t = this.attachMovie("ball_3","b"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfBalls);
t.onEnterFrame = mover;
}
function mover()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s = this._y /(centerY+radiusY);
this._xscale = this._yscale = s*100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale) + 100);
}
Q1: How would i go about inserting 3 DIFFERENT library objects (ie ball_1, ball_2, ball_3)?
Q2: Is it possble to make the objects pause at the front for a short period of time?
thanks for ANY help i can get on this. i am not a pro-actionscripter by any definition of the word, but i AM learning.
i can attach a sample file if you like.
Could Someone Please Help With Carousel
hey, i have downloaded this free carousel:
http://www.flashmo.com/preview/flashmo_056_carousel
i have customized it all fine with the way i would like it,
however, when clicking on a different button to go to a different frame, the initial frame that loads the icons and text in, still shows up on all frames, yet it is only on one frame,
Can anyone help me to unload or remove it so that it only loads once on that frame i put it on>?
im fairly new to flash so sorry if im stupid
thanks heaps,
here is the action script, it's 2.0
Code:
stop();
var total:Number = 6;
var label_list:Array = new Array( "1", "2", "3", "4", "5");
var radiusX:Number = 300;
var radiusY:Number = 70;
var centerX:Number = 400;
var centerY:Number = 110;
var speed:Number = 0.005;
tn_group_mc._visible = false;
info.text = ""; fm_label.text = "";
this._y = centerY + 230;
this._x = centerX - 400;
fm_label._y = centerY + 270;
fm_label._x = centerX - 340;
for( var i = 0; i < total; i++)
{
var t = tn_group_mc.duplicateMovieClip("tn"+i, i);
t.tn_mc.gotoAndStop(i+1); t.tn_shadow_mc.gotoAndStop(i+1);
t.fm_label = label_list[i];
t.angle = i * ((Math.PI*2)/total);
t.onEnterFrame = mover;
t.tn_mc.onRollOver = function()
{
fm_label.text =this._parent.fm_label;
}
t.tn_mc.onRollOut = function()
{
info.text = ""; fm_label.text = "";
}
}
function mover()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s = this._y /(centerY+radiusY);
this._xscale = this._yscale = s*130;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale) + 100);
}
this.onMouseMove = function()
{
speed = (this._xmouse-centerX) * 0.0001;
}
PLEASE HELP ME IT"S URGENT
2D Carousel
Right, I'm needing some help here folks, basically I'm setting up a website and I would like a sliding window effect in flash as part of the navigation in one area.
This is the idea http://www.htc.com/www/product.aspx
So far It's nearly working perfectly using some code from another project but it needs tweaked, I've looked Google to see about X/Y coordinates etc but can't find the right code or even know what to look for.
Basically the page consists of 2 arrows one on the right and one on the left, these slide pages from right to left or left to right depending on the arrow clicked. Unfortunately the code I'm using relied on 4 buttons to change the X Coordinates to slide the windows into place under the masked area. I now only have two buttons to do the same job and they only let me go between page 1 & 2, so I don't want to specify coordinates but rather add/subract to/from the current coordinates to get to the next/last window.
Anyone able to help me out or point me towards a tutorial?
Here is the code:
onClipEvent (load) {
_x = 0;
_y = 0;
spd = 4;
}
onClipEvent (enterFrame) {
_x += (endX-_x)/spd;
_y += (endY-_y)/spd;
_root.leftclick.onRelease = function() {
endX = 0;
endY = 0;
};
_root.rightclick.onRelease = function() {
endX = -800;
endY = 0;
}
}
Thanks in advance
Carousel
I'm working on a simple 3d carousel, reading from an xml file, but i cannot get the text tags that pop above the pictures to rotate with the items in the carousel. I'm following a tutorial based on MX, and believe it might be a problem with the mx.utils.Delegate function that i'm importing. help a brother out...
the function that is not working, as well as the code concerning delegation are bolded below, everything else is functioning properly.
Code:
import mx.utils.Delegate;
var numOfItems:Number = 10;
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2 - 35
var centerY:Number = Stage.height/2
var speed:Number = 0.02;
var perspective:Number = 0;
var home:MovieClip = this;
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
tooltip._alpha = 0;
var xml:XML = new XML();
xml.ignoreWhite = true;
xml.onLoad = function()
{
var nodes = this.firstChild.childNodes;
numofItems = nodes.length;
for(var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2) / numOfItems);
t.onEnterFrame = mover;
t.tooltext = nodes[i].attributes.tooltip;
t.icon.inner.loadMovie(nodes[i].attributes.image);
t.reflection.inner.loadMovie(nodes[i].attributes.image);
t.icon.onRollOver = over;
t.icon.onRollOut = out;
}
}
function over()
{
home.tooltip.tipText.text = this._parent.tooltext;
home.tooltip._x = this._parent._x;
home.tooltip._y = this._parent._y - this._parent._height/2;
home.tooltip.onEnterFrame = Delegate.create(this.moveTip);
home.tooltip._alpha = 100;
}
function out()
{
delete home.tooltip.onEnterFrame;
home.tooltip._alpha = 0;
}
function moveTip()
{
home.tooltip._x = this._parent._x;
home.tooltip._y = this._parent._y - this._parent._height/2;
}
xml.load("icons.xml");
function mover()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective) / (centerY + radiusY - perspective);
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale + 100));
}
this.onMouseMove = function() {
speed = (this._xmouse - centerX) /3500;
}
Carousel
hi all,
I've built up a carousel from Lee's tutorial. What he has done is he's fetching images from an XML file and when you click on a thumbnail it shows up the details.
Instead of this I want to fetching images by passing a query to the swf file.
eg:carousel.swf?pic1=1.jpg&pic2=2.jpg&... and so on. And when you click on a thumbnail instead of showing up the details I want to direct it to it's corresponding page.
Please download the source files.
Dowload the source files
Your help is highly appreciated.
Thanks very much.
Regards,
Soulfly
Carousel...
Hi!
I'm trying to make a vertical carousel and another horizontal working at the same time.
I've followed a tutorial on the net and now it works horizontally with this code:
import mx.utils.Delegate;
var numOfItems:Number;
var radiusX:Number = 300;
var radiusY:Number = 50;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 50;
var home:MovieClip = this;
var xml:XML = new XML();
xml.ignoreWhite = true;
xml.onLoad = function() {
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
for (var i = 0; i<numOfItems; i++) {
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i*((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.icon.inner.loadMovie(nodes[i].attributes.image);
t.r.inner.loadMovie(nodes[i].attributes.image);
t.icon.onRollOver = over;
t.icon.onRollOut = out;
t.icon.onRelease = released;
}
};
xml.load("icons.xml");
function mover() {
this._x = Math.cos(this.angle)*radiusX+centerX;
this._y = Math.sin(this.angle)*radiusY+centerY;
var s = (this._y-perspective)/(centerY+radiusY-perspective);
this._xscale = this._yscale=s*100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale)+100);
}
this.onMouseMove = function() {
speed = (this._xmouse-centerX)/8000;
};
When I change X and x for Y and y it works on vertical and it's ok.
The problem is that I can't put both of them working together at the same time...what is the problem? I was thinking that probably was because of the var home:MovieClip = this;but I don't know how to solve it.
Thanks a lot.
3D Carousel Bug?
http://www.celestrialrealms.com/indextest.html
The FACTIONS link.
Why's the <item> movieclip appearing for an instant in the upper left?
Code:
var numOfItems:Number = 4;
var radiusX:Number = 210;
var radiusY:Number = 156;
var centerX:Number = 420;
var centerY:Number = 313;
var speed:Number = 0.05;
var perspective:Number = 200;
for (var i=0;i<numOfItems;i++)
{
var t=this.attachMovie("item","item"+i,i+1);
t.angle=i*((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
}
function mover()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective) / (radiusY + centerY-perspective);
this._xscale = this._yscale = this._alpha = s * 100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale)+100);
}
The carousel is an external swf being loading into an empty movieclip.
Help
Carousel
Hello. Im trying to make a carouse for my website, in that carousel i want a picture in the middle and the icons around it to move in a way that they look 3d, meaning they never show the side but only the front. I am using the code from other carousel but that carousel when the icons are in the far right or far left turn and show the sides and look like plain pictures. How can i make them 3d? this is part of the code, i think this is what makes the carousel, i will appreciate a lot your help. Thanks!
// user transforms
if (pressv!=0) {
this.panel+=pressv;
pressv=pressv*.9;
if ((pressv<.2) && (pressv>-.2)) {
pressv=0;
}
}
// 3d transforms
theta+=_parent.speed;
xbit=Math.sin(Math.PI/180 * theta);
ybit=Math.cos(Math.PI/180 * theta);
this._xscale=ybit*this.panel;
this._x=xbit*this.radius;
this._alpha=20+(ybit+1)*50;
this._yscale=this.panel+ybit*1;
stack=Math.round((ybit+1)*radius*.5);
if (stack==100) {
stack=100;
}
this.swapDepths(stack);
Carousel
I have a photo scroller built with CS3 and actionscript. It uses XML to load images for the thumb-scroll portion. I'd like to know if there is a quick fix to make the picstrip seem to a carousel - in other words, the strip would just continue to scroll whether you moused left or right.
Another Carousel
Here
For a client, added distance blur, enhanced reflections, blah etc. Recently updated to use similar code from gotoandlearn, since that carousel was moderately better written than mine *ouch* in some parts, particularly the onEnterFrame model (hence it's about 50% faster too)
Reckon it's too fast? Tell me how badly this needs a stabbin'
PS. It's not actually this size in the clients interface, this merely shows that it's totally vector.
Carousel Help
Hello,
I've been working with the carousel tutorial from gotoAndLearn(). I understand the math after a lot of effort not being a programmer, but I still need help. Instead of the default continuous scrolling of the icons dependent on the mouse position, I want a button navigation system to move through each icon. So the bottom arrow buttons on the attached .fla would navigate and scroll each icon one at a time (each click). Any ideas on how to do this? thanks in advance
Carousel Help
Hello all!
I'm hoping you can help me out. I've done a carousel tutorial and everything is working fine except that I'm playing with the depth. And now one of my movies which is supposed to work, comes out below the other... see here for example go to Articles:
http://www.africandancelady.com
Can anyone help with it and tell me how to make the depht of the object come forward over the other?
Any help would be greatly appreciated! Thanks
Carousel Help
One request, I just want to know how to put an object in the center of this so it truly looks 3D. Right now, I've only figured out how to put the object either in front of or behind the carousel. Any advice would be great, thanks.
As well, if anyone has any input for things to make the carousel more unique, I'm open for suggestions. This script has been making the rounds on the web, it's useful, but I want to push it further. I'm just not very good with AS yet...
AS3 Carousel Help
Hi,
I have been doing the carousel tutorial by Lee Brimelow from gotoAndLearn.com, but have been trying to convert it to AS3.
I have gotten stuck and am hoping someone can help me out.
The problem is I'm trying to place four instances of the clip "item" onto the carousel, four of them are there but they are all in the same position.
you can see the swf and source fla here:
http://www.thelightdivided.co.uk/flash/index.html
http://www.thelightdivided.co.uk/flash/carousel.fla
The code I have so far is:
var numOfItems:Number = 4;
var radiusX:Number = 200;
var radiusY:Number = 50;
var centerX:Number = this.stage.stageWidth / 2;
var centerY:Number = this.stage.stageHeight / 2;
var speed:Number = 0.02;
var t:item;
// attach icons to the stage
for (var i = 0; i < numOfItems; i++) {
t = new item();
t.name = "item_"+i;
// place each item equally around the circle
t.angle = i * ((Math.PI*2) / numOfItems);
t.addEventListener(Event.ENTER_FRAME, mover);
// add to stage
addChild(t);
}
function mover(evt:Event):void {
this.x = Math.cos(evt.target.angle) * radiusX + centerX;
this.y = Math.sin(evt.target.angle) * radiusY + centerY;
var s:Number = this.y / (centerY + radiusY);
this.scaleY = this.scaleX = s;
evt.target.angle += this.speed;
trace(evt.target.name);
trace(this.x);
}
Many thanks
Chris
Carousel
Hi everybody
I have seen a great "animation" on this website : www.finaref.fr/etapes-du-credit.asp
I wish use it for my personel website, could you help me to creat it, could you please give me steps?
You can see what i want with this link : www.finaref.fr/etapes-du-credit.asp
Thank you in advance
Josiane (sorry for my poor inglish)
Carousel Help
I have used the tutorial from gotoandlearn.com to create a carousel. I have modified it so that it does not spin until the mouse actually moves however its terribly chunk and I have realised that it doesn't really do what I want it to do.
so
I have a circle of items and I want it so they dont move until you click on one of the words it moves to the front in a clock wise motion, im totally lost, here is the action script.
items contains a dynamic textfield with the word in it.
Quote:
var numOfItems:Number = 10;
var radiusX:Number = 232;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var moving:Boolean = true;
var boxes:Array = new Array();
//math.PI is equal to the radium of 360 degrees devided by the number of items.
for(var i=0;i<numOfItems;i++)
{
var t = this.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = setPos;
boxes.push(t);
t.onRelease = clicked;
}
//cos = angle which presents the ratio of the sides of item x axis
//sin = angle which presents the ratio of the sides of item y axis
function clicked()
{
trace("pos"+this.angle);
}
function stopMoving()
{
moving = false
trace("timer")
clearInterval(stopTimer);
}
function mover()
{
for(var i=0;i<numOfItems;i++)
{
boxes[i].angle += boxes[i]._parent.speed;
}
}
function setPos()
{
if(moving)
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = this._y / (centerY+radiusY);
this._xscale = this._yscale = s *100;
this.swapDepths(Math.round(this._xscale) + 100);
}
}
this.onMouseMove = function()
{
mover();
speed = (this._xmouse-centerX)/1500;
}
var stopTimer = setInterval(this, stopMoving, 100);
Carousel Help
I am following the tutorials on gotoLearn.com and I need some help loading a large image and transitioning. In the last tutorial I followed I got the small thumb nail image in the carousel to slide off to the left and some text to appear. But now when the thumb nail image slides over I need a larger image to appear. Has anyone worked on this tutorial and might be able to help?
AS2 - Carousel
Can anyone know any tutorial how to make similar to this?
http://www.earthcote.co.za/flash/#/p...h/countrywhite
or a sample file or a components thanks.
Carousel As2 To As3
hi
first of all i'd like to thank you for all the tutorials i can find here.
lastly i've been playing with your carousel tut and been porting it to as 3. i'm somewhere in the middle of 3rd video and i cant get the animation to work properly erm i think that link will just fit nice you'll see what im talking about.
http://szela93.0fees.net/Flash/Carousel2/
and here's the code
Code:
import fl.transitions.Tween;
import fl.transitions.TweenEvent;
import fl.transitions.easing.*;
var numOfItems:Number;
var radiusX:Number = 400;
var radiusY:Number = 150;
var centerX:Number = stage.stageWidth/2;
var centerY:Number = stage.stageHeight/2;
var speed:Number = 0.05;
theText.x = stage.stageWidth;
theText.y = stage.stageHeight;
theText.alpha = 0;
var tooltip = addChild(new ttip());
tooltip.name = "tooltip";
tooltip.scaleX = tooltip.scaleY = 0.4;
tooltip.alpha = 0;
var follower:MovieClip;
stage.addEventListener(MouseEvent.MOUSE_MOVE, setSpeed);
var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("list.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void {
myXML = new XML(e.target.data);
numOfItems = myXML.*.length();
for (var it=0;it<numOfItems;it++)
{
var t=stage.addChild(new item());
t.name = "item" + it;
trace(myXML.ICON[it].@URL);
t.ref.mask = t.masker;
t.angle = it*((Math.PI*2)/numOfItems);
t.addEventListener(Event.ENTER_FRAME, mover);
var i =new Loader();
i.load(new URLRequest(myXML.ICON[it].@URL));
t.icon.addChild(i)
var i2 =new Loader();
i2.load(new URLRequest(myXML.ICON[it].@URL));
t.ref.addChild(i2)
t.tooltext = myXML.ICON[it].@TIP;
t.acttype = myXML.ICON[it].@CLICKEFFECT.toString();
t.actcontent = myXML.ICON[it].@CLICKCONTENT;
t.btnPuppet.addEventListener(MouseEvent.ROLL_OUT, out);
t.btnPuppet.addEventListener(MouseEvent.ROLL_OVER, over);
t.btnPuppet.addEventListener(MouseEvent.MOUSE_UP, released);
}
}
function released(e:MouseEvent)
{
switch (follower.acttype)
{
case "navigate":
navigateToURL(new URLRequest(follower.actcontent));
break;
case "description":
tooltip.alpha=0;
tooltip.x=stage.stageWidth;
tooltip.y=stage.stageHeight;
for (var i = 0;i<numOfItems;i++)
{
out(null);
var t:Object = stage.getChildByName("item" + i);
t.xPos = t.x;
t.yPos = t.y;
t.theScale = t.scaleX;
t.removeEventListener(Event.ENTER_FRAME, mover);
t.btnPuppet.removeEventListener(MouseEvent.ROLL_OUT, out);
t.btnPuppet.removeEventListener(MouseEvent.ROLL_OVER, over);
t.btnPuppet.removeEventListener(MouseEvent.MOUSE_UP, released);
if (t != e.target.parent)
{
var twe1:Tween = new Tween(t,"scaleX",Strong.easeOut,t.scaleX,0,1,true);
var twe2:Tween = new Tween(t,"scaleY",Strong.easeOut,t.scaleY,0,1,true);
var twe3:Tween = new Tween(t,"alpha",Strong.easeOut,1,0,1,true);
}
else
{
var tw1:Tween = new Tween(t,"scaleX",Strong.easeOut,t.scaleX,1,1,true);
var tw2:Tween = new Tween(t,"scaleY",Strong.easeOut,t.scaleY,1,1,true);
var tw4:Tween = new Tween(t,"x",Strong.easeOut,t.x,167.3,1,true);
var tw5:Tween = new Tween(t,"y",Strong.easeOut,t.y,313.0,1,true);
var tw6:Tween = new Tween(theText,"alpha",Strong.easeOut,0,1,1,true);
theText.x = 307;
theText.y = 146.5;
theText.text = t.actcontent;
t.addEventListener(MouseEvent.MOUSE_OVER, twMotionFinishEvt);
}
}
break;
}
}
function twMotionFinishEvt(e:MouseEvent)
{
e.target.removeEventListener(MouseEvent.MOUSE_OVER, twMotionFinishEvt);
e.target.addEventListener(MouseEvent.MOUSE_UP, unreleased);
}
function unreleased(e:MouseEvent)
{
e.target.removeEventListener(MouseEvent.MOUSE_UP, unreleased);
var tw:Tween = new Tween(theText,"alpha",Strong.easeOut,1,0,.5,true);
for (var i = 0;i<numOfItems;i++)
{
var t:Object = stage.getChildByName("item" + i);
if (t != e.target.parent)
{
var twe1:Tween = new Tween(t,"scaleX",Strong.easeOut,0,t.theScale,1,true);
var twe2:Tween = new Tween(t,"scaleY",Strong.easeOut,0,t.theScale,1,true);
var twe3:Tween = new Tween(t,"alpha",Strong.easeOut,0,1,1,true);
}
else
{
var tw1:Tween = new Tween(t,"scaleX",Strong.easeOut,1,t.theScale,1,true);
var tw2:Tween = new Tween(t,"scaleY",Strong.easeOut,1,t.theScale,1,true);
var tw4:Tween = new Tween(t,"x",Strong.easeOut,167.3,t.xPos,1,true);
var tw5:Tween = new Tween(t,"y",Strong.easeOut,313.0,t.yPos,1,true);
t.removeEventListener(MouseEvent.MOUSE_UP, unreleased);
for (var it = 0; it < numOfItems; it++)
{
var te:Object = stage.getChildByName("item" + it);
te.addEventListener(Event.ENTER_FRAME, mover);
te.btnPuppet.addEventListener(MouseEvent.ROLL_OUT, out);
te.btnPuppet.addEventListener(MouseEvent.ROLL_OVER, over);
te.btnPuppet.addEventListener(MouseEvent.MOUSE_UP, released);
}
theText.x = stage.stageWidth;
theText.y = stage.stageHeight;
theText.alpha = 0;
}
}
}
function out(e:MouseEvent)
{
tooltip.removeEventListener(Event.ENTER_FRAME, moveTip);
tooltip.alpha = 0;
tooltip.tiptext.text="";
}
function over(e:MouseEvent)
{
tooltip.tiptext.text = e.target.parent.tooltext;
tooltip.x = e.target.parent.x;
tooltip.y = e.target.parent.y - e.target.parent.height/2;
tooltip.addEventListener(Event.ENTER_FRAME, moveTip);
follower = e.target.parent;
tooltip.scaleX = tooltip.scaleY = 0.7 * (follower.y / (centerY + radiusY));
tooltip.alpha = 1;
}
function moveTip(e:Event)
{
tooltip.scaleX = tooltip.scaleY = 0.7 * (follower.y / (centerY + radiusY));
tooltip.x = follower.x;
tooltip.y = follower.y - follower.height/2;
}
function mover(e:Event)
{
var t = e.target;
t.x = Math.cos(t.angle) * radiusX + centerX;
t.y = Math.sin(t.angle) * radiusY + centerY;
var s:Number = (t.y / (centerY + radiusY));
t.scaleX = t.scaleY = s;
t.angle += speed;
parent.setChildIndex(t,1);
sortItems()
}
function sortItems():void
{
for( var i:int = 0; i < numOfItems - 1; i++)
{
for(var j:int = 1; j < numOfItems; j++)
{
var temp1:DisplayObject = stage.getChildAt(j);
var temp2:DisplayObject = stage.getChildAt(j-1);
if( temp1.scaleX < temp2.scaleX )
{
stage.swapChildren(temp1, temp2);
}
}
}
}
function setSpeed(e:MouseEvent)
{
speed = (stage.mouseX - centerX)/(radiusX * 15);
}
i've tried to make it like tutorial says (i mean adding eventlistener to tween) but that gave me even more glitches and bugs so im stuck now.
thanks in advance
Carousel
Hi!
I have the following alteration made to the carousel:
- inserted a move left and a move right button
- when the buttons are pressed the carousel moves in the respective direction and stops
But when the carousel stops there isn´t an icon in the center.
What can I do so that an icon stops in the center?
All help appreciated. Thank you
Carousel Help
Hi,
I have been doing the carousel tutorial (fantastic by the way )
I am trying to make it so when you click on one of the loaded items you open an swf instead of loading the text into the dynamic text field. I have created a movie clip for the swf to load in called blank. I have also in the xml file made a new attribute called content. Each content attribute opens a different swf file which is written in the xml file like so:
<icon image="icon1.png" tooltip="Home" content="Main_win.swf"/>
can someone help me work out how to do this?
Cheers and thanks for taking the time to read this
A Little Help With The Carousel
i was wondering if it was possible to add links so if you click an item it shows the description then a link somewhere on the page? im new to flash thanks in advance i have no idea how to do or start this?
Carousel
Hi i'm a newb to flash and forums.
I'm trying to followthe great tutorial on the carousel but when i get to test the movie after i have got to the point were i should have one item in the carousel and it should rotate. I get one item in the top left hand corner that does not move.
i am using flash 8
here is my code
var numOfItems:Number = 1;
var radiusX:Number = 250;
var radiusY:Number = 75;
var centreX:Number = Stage.width/2;
var centreY:Number = Stage.height/2;
var speed:Number = 0.05;
for (var i = 0;i<numOfItems;i++)
{
var t = this.attachMovie("item1","item1"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
}
function mover()
{
this._x = Math.cos(this.angel)* radiusX + centreX;
this._y = Math.sin(this.angel)* radiusY + centreY;
var s:Number = this._y / (centreY+radiusY);
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
}
hoping that you may help as i'm tearing my hair out!
Bob
AS3 Carousel....
I've searched the forums and have found small issues with converting the AS2 carousel to AS3, but haven't found a finished version. Each post handles a separate small issue, not the big picture. I was curious if anyone has a successfully functioning version of the carousel in AS3 they'd be willing to share with the community?
--Thanks to all!
3D Carousel
I've done the 3D Carosel Part 2 tutorial and I want to gotoAndStop(); on a different frame label for each icon click on from a mc on the main stage...any thoughts?
It would also be nice to disable the carousel hot spots and send it behind or _alpha = 0 while the mc in front plays.
Thanks in advance.
Carousel HELP
Ok I am a total newb to flash actions scripting and I probably bit off more that I could chew out the gate. I am attempting to use the carousel tutorial to build an interactive website that allows the user to download PDF Files.
The problem I am having is that I don't know a lot about XML or AS3 so it's all french to me when I try to expand on the tutorial.
I have successfully changed the icons and created the carousel. I have also somewhat (and I am sure I am wrong on how I did this.) been able to add an additional movieClip from the library which has attached to it an additional XML file.
I am pretty sure my problem is I am over thinking this project. I have several XML files in several different folders. I have one flash document with 2 movies. I need help with figureing out what I am doing wrong and or a better way of getting the prject complete with out so many files.
this is the code in the main flash scene.
Code:
import mx.utils.Delegate;
import mx.transitions.Tween;
import mx.transitions.easing.*;
var numOfItems:Number;
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 0;
var home:MovieClip = this;
theText._alpha = 0;
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip", 10000);
tooltip._alpha = 0;
var xml:XML = new XML ();
xml.ignoreWhite = true;
xml.onLoad = function ()
{
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t = home.attachMovie ("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.toolText = nodes[i].attributes.tooltip;
t.content = nodes[i].attributes.tooltip;
t.icon.inner.loadMovie (nodes[i].attributes.image);
t.r.inner.loadMovie (nodes[i].attributes.image);
t.icon.onRollOver = over;
t.icon.onRollOut = out;
t.icon.onRelease = released;
t.link = nodes[i].attributes.link;
}
}
function over ()
{
home.tooltip.tipText.text = this._parent.toolText;
home.tooltip._x = this._parent._x;
home.tooltip._y = this._parent._y - this._parent._height/2;
home.tooltip.onEnterFrame = Delegate.create (this, moveTip);
home.tooltip._alpha = 100;
}
function out ()
{
delete home.tooltip.onEnterFrame
home.tooltip._alpha = 0;
}
function released()
{
var pieces = attachMovie ("piecesMV", yo, 200000);
pieces._y =70;
home.tooltip._alpha = 0;
for (var i=0;i<numOfItems;i++)
{
var t:MovieClip = home ["item" + i];
t.xPos = t._x;
t.yPos = t._y;
t.theScale = t._xscale;
delete t.icon.onRollOver;
delete t.icon.onRollOut;
delete t.icon.onRelease;
delete t.onEnterFrame;
if(t != this._parent)
{
var tw:Tween = new Tween (t, "_xscale" , Strong.easeOut,t._xscale,0,1,true);
var tw2:Tween = new Tween (t, "_yscale" , Strong.easeOut,t._yscale,0,1,true);
var tw3:Tween = new Tween (t, "_alpha" , Strong.easeOut,100,0,1,true);
}
else
{
var tw:Tween = new Tween (t, "_xscale" , Strong.easeOut,t._xscale,150,1,true);
var tw2:Tween = new Tween (t, "_yscale" , Strong.easeOut,t._yscale,150,1,true);
var tw3:Tween = new Tween (t, "_x" , Strong.easeOut,t._x,100,1,true);
var tw4:Tween = new Tween (t, "_y" , Strong.easeOut,t._y,200,1,true);
var tw5:Tween = new Tween (theText, "_alpha" , Strong.easeOut,0,100,1,true);
theText.text = t.content;
var s:Object = this;
{
s.onRelease = unReleased;
}
}
}
}
function unReleased ()
{
removeMovieClip (yo);
delete this.onRelease;
var tw5:Tween = new Tween (theText, "_alpha" , Strong.easeOut,100,0,0.5,true);
for (var i=0;i<numOfItems;i++)
{
var t:MovieClip = home ["item" + i];
if(t != this._parent)
{
var tw:Tween = new Tween (t, "_xscale" , Strong.easeOut,0,t.theScale,1,true);
var tw2:Tween = new Tween (t, "_yscale" , Strong.easeOut,0,t.theScale,1,true);
var tw3:Tween = new Tween (t, "_alpha" , Strong.easeOut,0,100,1,true);
}
else
{
var tw:Tween = new Tween (t, "_xscale" , Strong.easeOut,100,t.theScale,1,true);
var tw2:Tween = new Tween (t, "_yscale" , Strong.easeOut,100,t.theScale,1,true);
var tw3:Tween = new Tween (t, "_x" , Strong.easeOut,t._x,t.xPos,1,true);
var tw4:Tween = new Tween (t, "_y" , Strong.easeOut,t._y,t.yPos,1,true);
tw.onMotionStopped = function ()
{
for (var i=0;i<numOfItems;i++)
{
var t:MovieClip = home ["item"+i];
t.icon.onRollOver = Delegate.create (t.icon,over);
t.icon.onRollOut = Delegate.create (t.icon,out);
t.icon.onRelease = Delegate.create (t.icon,released);
t.onEnterFrame = mover;
}
}
}
}
}
function moveTip()
{
home.tooltip._x = this._parent._x;
home.tooltip._y = this._parent._y - this._parent._height/2;
}
xml.load ("icons.xml");
function mover()
{
this._x = Math.cos (this.angle) * radiusX + centerX;
this._y = Math.sin (this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective) /(centerY+radiusY - perspective);
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths (Math.round(this._xscale) + 2);
}
this.onMouseMove = function ()
{
speed = (this._xmouse-centerX)/5000;
}
this is the code in the movie stored in my library.
Code:
import mx.utils.Delegate;
import mx.transitions.Tween;
import mx.transitions.easing.*;
var numOfItems:Number;
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 0;
var home2:MovieClip = this;
theText._alpha = 0;
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip", 10000);
tooltip._alpha = 0;
var xml:XML = new XML ();
xml.ignoreWhite = true;
xml.onLoad = function ()
{
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t2 = home2.attachMovie ("item","item"+i,i+1);
t2.angle = i * ((Math.PI*2)/numOfItems);
t2.onEnterFrame = mover;
t2.toolText = nodes[i].attributes.tooltip;
t2.content = nodes[i].attributes.link;
t2.icon.inner.loadMovie (nodes[i].attributes.image);
t2.r.inner.loadMovie (nodes[i].attributes.image);
t2.icon.onRollOver = over;
t2.icon.onRollOut = out;
t2.icon.onRelease = released;
t2.link = nodes[i].attributes.content;
}
}
function over ()
{
home2.tooltip.tipText.text = this._parent.toolText;
home2.tooltip._x = this._parent._x;
home2.tooltip._y = this._parent._y - this._parent._height/2;
home2.tooltip.onEnterFrame = Delegate.create (this, moveTip);
home2.tooltip._alpha = 100;
}
function out ()
{
delete home2.tooltip.onEnterFrame
home2.tooltip._alpha = 0;
}
function released()
{
if(t2 != this._parent)
{
getURL (t2.link);
}
}
function unReleased ()
{
removeMovieClip (yo);
delete this.onRelease;
var t2w5:Tween = new Tween (theText, "_alpha" , Strong.easeOut,100,0,0.5,true);
for (var i=0;i<numOfItems;i++)
{
var t2:MovieClip = home2 ["item" + i];
if(t2 != this._parent)
{
var t2w:Tween = new Tween (t2, "_xscale" , Strong.easeOut,0,t2.theScale,1,true);
var t2w2:Tween = new Tween (t2, "_yscale" , Strong.easeOut,0,t2.theScale,1,true);
var t2w3:Tween = new Tween (t2, "_alpha" , Strong.easeOut,0,100,1,true);
}
else
{
var t2w:Tween = new Tween (t2, "_xscale" , Strong.easeOut,100,t2.theScale,1,true);
var t2w2:Tween = new Tween (t2, "_yscale" , Strong.easeOut,100,t2.theScale,1,true);
var t2w3:Tween = new Tween (t2, "_x" , Strong.easeOut,t2._x,t2.xPos,1,true);
var t2w4:Tween = new Tween (t2, "_y" , Strong.easeOut,t2._y,t2.yPos,1,true);
t2w.onMotionStopped = function ()
{
for (var i=0;i<numOfItems;i++)
{
var t2:MovieClip = home2 ["item"+i];
t2.icon.onRollOver = Delegate.create (t2.icon,over);
t2.icon.onRollOut = Delegate.create (t2.icon,out);
t2.icon.onRelease = Delegate.create (t2.icon,released);
t2.onEnterFrame = mover;
}
}
}
}
}
function moveTip()
{
home2.tooltip._x = this._parent._x;
home2.tooltip._y = this._parent._y - this._parent._height/2;
}
xml.load ("pieces/pieces.xml");
function mover()
{
this._x = Math.cos (this.angle) * radiusX + centerX;
this._y = Math.sin (this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective) /(centerY+radiusY - perspective);
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths (Math.round(this._xscale) + 2);
}
this.onMouseMove = function ()
{
speed = (this._xmouse-centerX)/5000;
}
3D Carousel?
I was curious as to how you would make a 3d carousel like the one on itunes, and have it so when you click on the picture it goes to a link (different for each one).
All help is appreciated
Carousel And Xml Help
im doing the carousel tutorial and am having problems with the xml file. when i try to test the movie i get the following error:
Error opening URL
"file:///homes/loconklin/Documents/flash%20project/carousel/undefined"
i have the .xml, .swf, and .fla files and images all in the same folder.
this is my actionscript
var numOfItems:Number = 10;
var radiusX:Number = 350;
var radiusY:Number = 60;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.08;
var perspective:Number = 130;
var home:MovieClip = this;
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
tooltip._alpha = 0;
var xml:XML = new XML();
xml.ignoreWhite = true;
xml.onLoad = function()
{
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.toolText = nodes[i].attributes.tooltip;
t.icon.inner.loadMovie(nodes[i].attributes.image);
t.ref.inner.loadMovie(nodes[i].attributes.image);
}
}
xml.load("icon.xml");
function mover()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y-perspective) / (centerY+radiusY-perspective);
this._xscale = this._yscale = s * 150;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale) + 200);
}
this.onMouseMove = function()
{
speed = (this._xmouse-centerX)/2500;
}
[/code]
Carousel Q's
ok so i have a carousel but its embedded in a movie clip because i have multiple products but the alignment of the carousel is off in the bottom left corner. when i test it in the main timeline the alignment is ok. so its definetely the movie clip. i messed with the nubers but the it gets reall FUBAR. does anyone know the numbers or code i need?
thanksNICO
3D Carousel
Code:
var numOfItems:Number;
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 130;
var home:MovieClip = this;
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
tooltip._alpha = 0;
var xml:XML = new XML ();
xml.ignoreWhite = true;
xml.onLoad = function()
{
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
for(var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.toolText = nodes[i].attributes.tooltip;
t.icon.inner.loadMovie(nodes[i].attributes.image);
t.r.inner.loadMovie(nodes[i].attributes.image);
}
}
xml.load("icons.xml");
function mover ()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective) / (centerY+radiusY-perspective);
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale) + 100);
}
this.onMouseMove = function()
{
speed = (this._xmouse-centerX)/3500;
}
Why does it do that?
3d Carousel Help
Hey guys. Well I would not say I am new to Action Script but it has been about a year since I have done any work like this. My issue is I have a client that wants a Carousel effect but they do not want the Carousel to spin all the time. They want to have the carousel only spin when you roll over a item and then stop with that item in the front unless your mouse is over another item. Can some please help. I figured this tutorial would cove that but after building the first peace and watching the last 2 videos I released it did not.
Carousel
I was just testing with the downloadable file before I went ahead and tried to make my own.
- When I upload to my website and click on the links I get "undefined"
Carousel
Does anyone know how Lee makes those sweet icons? I would like to make some of my own, but I do not even know where to begin. Some pointers would be greatly appreciated! Thanks in advance!!!!!!!
Andrew
|