Mootools creation de class

Version imprimable

Bonjour, je suis en train de développer une bibliothèque de classe pour la création de site.
Malheureusement j'ai une erreur que je ne comprend pas.

Citation:

element is null
[Stopper sur une erreur] element.appendChild(context);

L'erreur apparait dans le fichiers mootools, et non dans mon fichier du coup je n'arrive pas à comprendre l'erreur.

Voici la fonction qui me pose problème dans ma class :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 var slides = []; for(var i = 0; i < this.images.length; i++) { var elemenImage = new Element('img', { src: this.images[i], styles: { opacity: 0, position: 'absolute', 'z-index': 10 } }); elemenImage.inject(this.options.divEmplacement); }
L'erreur est lié avec la ligne mit en rouge.

Merci de vos réponse.

23/11/2011, 18h48
vermine

Bonsoir,

Je pense qu'element fait ici référence à this.options.divEmplacement. Etes-vous sûr que cet élément existe ? Vous essayez de rajouter une image dans un <select> ?

Bonjour,

Mon element this.options.divEmplacement est non null.

J'ai vérifier avec un alert() et j'obtiens bien une valeur.

Code:

alert(this.options.divEmplacement)

C'est une options que je règle lors de l'appel du constructeur.

Je n'essaye pas d'ajouter une image dans un select, mais dans un tableau d'images documentation mootools : Asset.

Une fois les images chargé, cette fonction est appelé afin d'ajouter les éléments dans la page HTML. Il sont mit bout à bout, et périodiquement il sont tous masqué sauf un dont l'opaciter est à 1.

Voici le message d'erreur complet (selon FireBug):
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 element is null bottom() mootools-core.js (ligne 3095) context = img#imgSlide0 ./images...2._m.jpg element = null inject() mootools-core.js(ligne 3277) el = "slideshow-holder-page" where = "bottom" complet() class.js (ligne 368) wrapper() mootools-core.js(ligne 1311) main() class.js (ligne 339) wrapper() mootools-core.js(ligne 1311) ?p=pageSliders() ?p=pageSliders (ligne 100) [Stopper sur une erreur] element.appendChild(context); mootools-core.js(ligne 3095)
class.js -> mon fichier contenant la classe qui bug.

Merci de vos réponse.

25/11/2011, 07h48
vermine

Pourrions-nous avoir plus de code ? J'aimerais pourvoir créer une page de test. ;)

Pas de soucis, voici mon code :

Code:

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
var sliders = new Class({
	Implements: Options,
		options : {
			//Couleur de l'arriere plan
			couleurArrierePlan : 'none',
			//Repertoire contenant les images
			repertoireImage : './images/',
			//Temps chamgement image
			tempsSeconde : 1000,
			//div emplacement du slider
			divEmplacement : 'slideshow',
		},
 
	//les variables
	images : [],
	index: 0,
 
	//Fonction d'initialisation
	initialize: function(options, dataImage){
		this.setOptions(options);
		for(var i = 0; i < dataImage.length; i++)
			this.images.push(dataImage[i]);
	},
 
	main : function() {	//Fonction principale
		for(var i = 0; i < this.images.length; i++)
			this.images[i] = this.options.repertoireImage + this.images[i];
 
		//Tableau d'images
		var loader = new Asset.images(this.images, {
			// onComplete: function() {
			onComplete: this.complet(),
				// this.complet();
			// }
		});
	},
 
	complet: function()
	{
		var slides = [];
		var elemenImage;
 
		for(var i = 0; i < this.images.length; i++)
		{
			slides.push(
			elemenImage = new Element('img', {
				id: 'imgSlide'+i,
				src: this.images[i],
				styles: {
					opacity: 0,
					position: 'absolute',
					'z-index': 10,
				},
			});
			elemenImage.inject($('slideshow-holder-page'), 'bottom');
			);
		}
		/*
		// this.images.each(function(im, num) {
			// slides.push(new Element('img', {
				// src: im,
				// styles: {
					// opacity: 0,
					// position: 'absolute',
					// 'z-index': 10
				// }
			// }).inject(this.options.divEmplacement));
		// });
 
 
		(function() {sliders[index].tween('opacity', 1);}).delay(1000);
 
		var start = function(){(
			function()
			{
				this.options.divEmplacement.setStyle('background', this.options.couleurArrierePlan);
				slides[index].fade(0);
				++index;
				index = (slides[index] ? index : 0);
				slides[index].fade(1);
			}).periodical(this.options.tempsSeconde);
		};
		start();
		*/
	},
});