utilisé mooflow pour mootools 1.2

**errog** · 24/12/2009, 09h48

Bonjour,
Je débute avec mootools, donc le pb que je présente n'est peut être pas scpécifique a mooflow :

En gros ca ne fonctionne pas : le cadre noir apparait ( en fade ) sans images.
( celles ci sont bien nommées car le code html sans javascript les affiche).

j'ai récupéré le code source de la page mooflo, les fichiers MooFlow.js et .css et aussi ../styles.css
j'ai placé des images ou il fallait.
J'utilise Mootools 1-2-4 et c'est peut la que ça pose pb : je m'yperds avec le core et le more ( l'ai tout chargé ).

D'ou peut venir le pb ? Merci beaucoup.. je patauge....

**BeRoots** · 31/05/2011, 13h59

bonjour à tous

je souhaite utilisé mooflow pour mootools 1.2.
j'ai fait comme suit:
1°) le html:
http://www.pasteall.org/22072/html4strict
2°) le js qui me lance les fonction mooflow au domready
http://www.pasteall.org/22071/javascript
3°) le js de mooflow (source)
http://www.pasteall.org/22073/javascript

mon firebug me donne une erreur comme suit:

this.MooFlow is null

Line 53

donc erreur ligne 53 du js sources de mooflow.

Si quelqu'un à une idée...
Merci d'avance

**vermine** · 31/05/2011, 15h02

Bonjour,

A première vue je dirais qu'il y a une erreur de casse dans l'id. Vous définissez en minuscule cette <div> :

Code html :

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

<div id="mooflow">

Et vous construisez l'objet MooFlow en recherchant un id avec des majuscules :

Code :

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

new MooFlow($('MooFlow')

Ce n'est donc pas le même objet. Celui avec majuscule n'existe pas.

Tant qu'à jouer avec l'id, faites quand même attention d'utiliser des mots clefs comme id. Le terme "MooFlow" est peut-être réservé.

**BeRoots** · 01/06/2011, 13h59

bien c'etait bien cela...

par contre il me charge qu'un grand carré noir sans les image ni les boutons et le slider.

Si quelqu'un à une idée ?
Merci d'avance...

**vermine** · 01/06/2011, 17h09

Je n'ai pas su recréer votre page. Je manque de fichiers, apparemment. Les CSS surtout. J'ai essayé avec une version de Mootools 1.2.4, je suppose que ça ne devrait pas trop changer.

**BeRoots** · 01/06/2011, 19h29

tres bien merci. J'attend de vous

c'est etrange car j'ai tester d'autre parametre de mooflow comme le ratioheight qui fonctionne mais je n'est ni les image du carrouselle ni les boutons demander

**BeRoots** · 01/06/2011, 20h30

il vous faudrai le mooflow complet... avec les images aussi...
voici la css: http://www.pasteall.org/22093/css

**vermine** · 02/06/2011, 18h26

Il me manque encore des CSS, je n'arrive à rien sans, je pense.

Code :

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

1
2
3
4
5
 
    <!-- CSS -->
    <link href="./css/athomemedia_BASE.css" media="screen" rel="stylesheet" type="text/css" />
    <link href="/asset/mootools-1.2.2/css/mootools.css" media="screen" rel="stylesheet" type="text/css" />
    <link href="/asset/mooflow/css/mooflow.css" media="screen" rel="stylesheet" type="text/css" />

Je n'ai que celle de mooflow, je suppose. Et dedans il y a des liens vers des images. Avez-vous ces images dans votre projet ? Je pense que ce sont les boutons que vous désirez.

**BeRoots** · 03/06/2011, 14h54

j'ai repris suivant les indications de la documentation de mooflow et je suis reparti sur une page de test... Attention, V0.2 de mooflow (donc les image son dans un dossier skin et non plus img)

Voici le problème, chargement de mooflow avec l'image ajax_loader.gif mais rien ne ce passe (aucun chargement des image ni bouton afficher)

voici les sources:
html ==> http://www.pasteall.org/22141/html4strict
mooflow 0.2 ==> http://www.outcut.de/MooFlow/Download.html

reste à vôtre attention de modifier les images à charger ligne 52 à 54 du html mais la page sera plus facile à recréer.

Ma question est pourquoi l'on a l’icône de chargement mais que les image ne s'affiche pas ?

Merci d'avance

PS. j'ai repris exactement le mêm code source que l'exemple de mooflow http://www.outcut.de/MooFlow/MooFlow.html

**vermine** · 03/06/2011, 15h13

Au temps pour moi, je faisais l'bièsse avec mes blibliothèques.

Hé ben j'ai une mauvaise nouvelle, ça fonctionne bien chez moi.

Petite remarque, je suis en version core et more 1.2.4. C'est peut-être là que le bât blesse.

C'est peut-être la taille de vos images aussi.

**BeRoots** · 04/06/2011, 13h43

bonjour,

Apres divers test il semble que le probleme soit lier au navigateur. j'ai donc fait exactement la mêm chose que l'exemple de chez mooflow qui lui passe sous tout navigateur sans autre script de compatibilité, mais chez moi je bug sous FF, IE<6, netscape. Par contre fonctionne bien sous Opera, Chrome, Safari, IE 6 & 7.

Mon objectif est qu'il fonctionne sous FF car les vieilles version de navigateur devienne obselète.

Si quelqu'un à une idée sur mon dernier exemple qui n'est en fait qu'une reproduction de la page exemple de mooflow. Chez mooflow il fonctionne même sous FF alors que chez moi rien a faire pour avoir chargement des image sous FF car il reste sur le logo loader...

NB. Je suis passer à mootools 1.3.2 mais il semble que de la version 1.2 à celle_ci il n'y ai aucun changement du comportement de mooflow

**BeRoots** · 04/06/2011, 13h47

La version de mootools est indifférente au fonctionnement de mooflow.

**vermine** · 04/06/2011, 15h30

Effectivement il y a des comportements douteux avec FF.

Voici deux solutions indépendantes à tester :

1) Si vous avez la 'Developer Toolbar' installée sur FF, n'utilisez pas l'option qui désactive le cache.

2) Il y a une ligne de code à changer dans la source MooFlow.js. Il faut rajouter la partie avec le src :

Code :

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

1
2
3
4
5
 
Element.implement({
    reflect: function(arg){
               //var i = arg.img.clone(); // change this to the one below
               var i = arg.img.clone().set('src', arg.img.src); // this works in mootools 1.2.1

**BeRoots** · 04/06/2011, 15h41

effectivement la methode 2 fonctionne sous FF

Mais pourtant aucun hack n'est utiliser sur la page de demo de mooflow et pourtant sa fonctionne tres bien sous FF ???

Une idée ?

d'après ma logique, pourquoi allez bidouiller si cela fonctionne bien chez le concepteur du projet

**vermine** · 04/06/2011, 17h32

Je n'en sais fichtre rien.

**BeRoots** · 04/06/2011, 18h33

poster le sujet en actualité serai il une bonne idée ?

**vermine** · 04/06/2011, 20h27

Non. Il est trop technique sous cette forme. Créer un nouveau topic qui serait plus orienté débat, annonce ou bien news, reste dans le domaine du possible. Mais il ne sera publié que les forums de développement Web, si le patron l'accepte.

Malheureusement, je ne vois pas trop en quoi ce sujet serait une actualité.

Mais vous pouvez toujours exposer votre idée ici.

**BeRoots** · 05/06/2011, 01h18

Nan disons que je vais attendre q'un utilisateur chevronner de mooflow puisse nous dire pourquoi ce dernier fonctionne si bien sur leur site sans hack apparent et pourquoi en refaisant exactement la m^me chose on à bug sous FF

Merci d'avance

**BeRoots** · 05/06/2011, 16h38

Conclusion:
J'ai refait la page identique au site de mooflow V0.2 et j'ai constater sur ce test que mooflow 0.2 est adapter a mootools 1.2 (dès 1.2.1 il bug).

Il est donc obligation de modifier le script mooflow.js comme suit:

Code :

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

1
2
3
4
Element.implement({
    reflect: function(arg){
               //var i = arg.img.clone(); // change this to the one below
               var i = arg.img.clone().set('src', arg.img.src); // this works in mootools 1.2.1

Ceci permet à mooflow de fonctionner avec les version mootools supérieur à 1.2 (j'ai tester jusque à 1.3.2). Cette modification est pour le navigateur Firefox sous toute ces versions.

Encore merci à vermine pour sont aide précieuse.