Rien d’exceptionnel dans cette source, mais c’est un bon point de départ pour réaliser un caroussel sympa.

Celui ci permet de modifier très simplement le rayon X, le rayon Y, la perspective, la vitesse de rotation, les coordonnées x/y.
Une base xml permet de charger dynamiquement le nombre d’images souhaitées.

Télécharger les sources

1.Définition des variables, les noms parlent d’eux même :

var hScene:Number = Stage.height;
var wScene:Number = Stage.width;
var numOfItems:Number;
var radiusX:Number=300;
var radiusY:Number=110;
var centerX:Number=wScene/2;
var centerY:Number=hScene/2;
var nSpeed:Number=0.05;
var perspective:Number=100;

2. Chargement du xml

//chargement du xml
function load_xml(path:String,type:String){
var xml:XML = new XML();
xml.ignoreWhite = true;
xml.onLoad=function(){
var nodes = this.firstChild.childNodes;
numOfItems = nodes.length;
//appel fonction de création du caroussel quand tout est chargé.
genereCarousel(nodes);
}
xml.load("xml/"+path);
}

3. Création du caroussel

function genereCarousel(nodes){
level = this.getNextHighestDepth();
this.createEmptyMovieClip("carrousel"+iCarousel,iCarousel);
//creation d'un MovieClip vide pour accueillir le caroussel
clipHote = this["carrousel"+iCarousel];
for (var i=0;i<numOfItems ;i++){
//creation des Movieclip du caroussel (t)
var t=clipHote.attachMovie("item","item"+i,i+1);
t.angle = i* ((Math.PI*2)/numOfItems);
t._y=Math.sin(t.angle)*radiusY +centerY;
var s:Number = (t._y - perspective)/(centerY + radiusY - perspective)
t._xscale=t._yscale=s*50;
t._x=Math.cos(t.angle)*150+centerX;
t.icon.inner.loadMovie(nodes[i].attributes.image);
t.icon.smoothing=true;
//reflet
t.ref.inner.loadMovie(nodes[i].attributes.image);
t.swapDepths(Math.round(t._xscale) + 100 +i);
//mouvement
t.onEnterFrame = mover;
}
}

4. Rotation du caroussel

function mover(){
this.swapDepths(Math.round(this._xscale) + 100);
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 += nSpeed;
}

5.Gestion de la vitesse de rotation selon la position de la souris

this.onMouseMove = function(){
//mise a jour de la variable de vitesse utilisée dans la fonction mover
nSpeed=(this._xmouse-centerX)/15000;
}

6. Résultat
Ci dessous le résultat :

Flash Carousel AS2 vertical

Télécharger les sources
Télécharger les sources v2 avec ajout d’un lien sur chaque image comme demandé dans les commentaires

Flash Carousel AS2 vertical

Télécharger les sources v3 avec ajout de la cible du lien dans le xml et rotation verticale du carousel

Be Sociable, Share!