Récupération d'objet avec onComplete après un Morph

**al1pb** · 15/10/2012, 10h49

Bonjour,
J'ai un petit soucis avec un code Mootools que voilà:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Test Mootools</title>
		<script src="mootools-core.js"></script>
	</head>
	<body>
		<h3 id="titre">Titre 1</h3>
 
		<script>
		window.addEvent('domready',function(){
			function ClasseEff(id,temps){
				this.eff1 = new Fx.Morph(id,{
					duration:temps,
					transition:'quad:in',
					onComplete:function(el){
						this.eff2.start({'fontSize':'16px'});
						// ne fonctionne pas car this est un objet morph et non ClasseEff
					}
				});
				this.eff2 = new Fx.Morph(id,{
					duration:temps,
					transition:'quad:out',
					onComplete:function(){
						this.eff1.start({'fontSize':'80px'});
						// ne fonctionne pas car this est un objet morph et non ClasseEff
					}
				});
				this.go = function(){
					this.eff1.start({'fontSize':'80px'});
				};
			}
			var effet = new ClasseEff($('titre'),2000);
			effet.go();
		});
		</script>
	</body>
</html>

J'ai mis une page html entière pour permettre les testes...

Mon problème est que je n'arrive pas à exécuter le 2e effet (effet.eff2.start()) à la fin du 1er effet...
Comme écrit en remarque dans mon code, this correspond à un objet Morph et non à ma class effet.
Existe-il une solution ?
Merci d'avance.

**vermine** · 15/10/2012, 11h37

Bonjour,

Je dois avouer que je ne comprends pas votre manière de faire. Vu que vous parlez de Class, autant créer une classe et lui donner des méthodes. Le this sera remplacé par l'objet effet (qu'on veillera à rendre accessible) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
var ClasseEff = new Class({
   initialize: function(id, temps){
      this.id = id,
      this.temps = temps,
 
      this.eff1 = new Fx.Morph(this.id,{
         duration: this.temps,
         transition: 'quad:in',
         onComplete: function(){
            effet.eff2.start({'fontSize':'16px'});
         }
      }),
 
      this.eff2 = new Fx.Morph(this.id,{
         duration: this.temps,
         transition: 'quad:out',
         onComplete: function(){
            effet.eff1.start({'fontSize':'80px'});
         }
      })
   }
});
 
var effet = new ClasseEff($('titre'), 2000);
effet.eff1.start({'fontSize':'80px'});

**al1pb** · 15/10/2012, 11h58

Bonjour,
Merci de me répondre.

Envoyé par vermine

Je dois avouer que je ne comprends pas votre manière de faire

Alors, je suis assez mal partis...

Mon but est de pouvoir créer plusieurs objets avec différents annimations:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
window.addEvent('domready',function(){
			function ClasseEff(id,temps){
				this.eff1 = new Fx.Morph(id,{
					duration:temps,
					transition:'quad:in',
					onComplete:function(el){
						this.eff2.start({'fontSize':'16px'});
						// ne fonctionne pas car this est un objet morph et non ClasseEff
					}
				});
				this.eff2 = new Fx.Morph(id,{
					duration:temps,
					transition:'quad:out',
					onComplete:function(){
						this.eff1.start({'fontSize':'80px'});
						// ne fonctionne pas car this est un objet morph et non ClasseEff
					}
				});
				this.go = function(){
					this.eff1.start({'fontSize':'80px'});
				};
			}
			var effet = new ClasseEff($('titre'),2000);
			effet.go();
			var effet2 = new ClasseEff($('text'),1000);
			effet2.go();
		});

C'est pour cette raison que j'aimerais récupérer "une instance" à la fin du Morph eff1 pour lancer le 2e.

J'espère être un peu plus claire, c'est pas évident à expliquer...

Le but final du scripte est de récupérer des informations d'animation puis créer les objets morph et les exécuter.

Encore merci.

Récupération d'objet avec onComplete après un Morph [MooTools]

Bibliothèques & Frameworks

Vue hybride

Discussions similaires

Partager

Partager