Discussion :

[brisso]

Bonjour à tous, ou plutôt re-bonjour...
Me voilà avec un petit soucis que je ne comprend absolument pas.
Sur mon blog wordpresse, j'utilise un effet lightbox grâce à pirobox.
Jusque là tout va bien. J'ai fait un petit script jQuery que voilà :

Code :

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

1
2
3
4
5
6
7
8
9
     <script type="text/javascript">  
          $(document).ready(function($) {
            $("a[href$='.jpg'], a[href$='.jpeg'], a[href$='.gif'], a[href$='.png']").each(function(){
                if (!$(this).hasClass('pirobox')) {
                    $(this).addClass('pirobox');
                }
            });
        })
    </script>

Qui me permet d'ajouter la class pirobox à toutes mes images dont l'url pointe vers les images en questions...

Le hick, c'est qu'avec mon script, la class est bien ajouté dans mon image, mais rien ne se passe lorsque je clique dessus. En gros le lien pointe bien vers l'image mais sans effet lightbox.
Le plus incompréhensible c'est qu'en écrivant class="pirobox" manuellement lors de l'édition de mon article, ça fonctionne !

Voilà un exemple sur l'article que je viens d'écrire : article

En regardant la source de l'image d'entête vous vérez bien class="pirobox hovering" (hovering étant pour l'effet d'opacité blanc), dans ce cas, la classe est ajouté en php lors de la création de page.

Dans l'autre cas, sur l'image au coeur de l'article, vous verrez également class="pirobox", cette fois ajouté en js mais rien ne se passe...

Je suis un peu perdu , des éclairages ou des réponses à des cas similaires pourraient m'aider.
Merci

[brisso]

je m'auto-répond...
J'ai finalement trouvé le problème.
La fonction pirobox n'était éxécutée qu'une fois lors du chargement de la page et mon script injectait la class alors que pirobox était déjà éxécuté...du coup. Ba la class était bien là mais ça ne fonctionnait pas.
Après beaucoup de tests de repositionnement de mes différentes lignes de code dans ma page. J'ai finalement positionné mon petit script juste avant que que la fonction pirobox soit éxévutée. Ainsi, la class est créée avant que pirobox ne crée les différentes tables html pour afficher les lightbox.
Je ne sais pas si c'est claire...mais ça fonctionne.

La fin de pirobox.js

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
...
...
...
$("a[href$='.jpg'], a[href$='.jpeg'], a[href$='.gif'], a[href$='.png']").each(function(){
				if (!$(this).hasClass('pirobox')) {
					$(this).addClass('pirobox');
				}
			});
		start_pirobox();
	}
})(jQuery);

[SpaceFrog]

voir aussi live() , on() ou delegate() ...

[brisso]

Merci pour ton conseil, bien que je ne m'y connaisse que très peu et je ne penses pas que les fonctions dont tu parles me concernent ici.

Dans la mesure où pirobox.js est exécuté une fois seulement au chargement de la page. Il n'est déclencher par aucun évènement.

Je m'explique. Pirobox va ajouter dans le DOM les différentes balises nécessaires à l'affichage de la lightbox puis les cacher. C'est seulement lors du click sur l'image que l'évènement "click" pour le coup intervient et affiche les différents éléments préalablement générés puis cachés.

Si j'ai bien compris, live() et on() permettent de liés des éléments à une fonctions même si ils sont générés après l’exécution de cette dernière, hors là, c'est la fonction qu'il aurait fallu exécuter après la création des éléments.

[SpaceFrog]

sisi justement ce sont des methodes qui permettent de faire heriter aux elements crées dynamiquement après le ready, les evenements attibués dans le ready

[brisso]

Et bien alors je n'ai pas bien compris. Si tu pouvais me rediriger vers un exemple ou autre je suis preneur. Je n'ai pas trouvé d'explication ni de démonstration.
Merci

[SpaceFrog]

http://api.jquery.com/live/

[moi-jeux]

Bonjour,
J'ai une question dont je n'ai pas trouvé la réponse après 2h (au moins !!) de rechercher sur internet....
Je voudrais intégrer une light box Aweber sur mon blog wolrdpress héberger par ovh.
Dans la formation initiale, il m'était indiqué que je devais mettre la ligne de commande dans l'éditeur sur la "page" header après

<body class="costum">

Or il s'avère qu'en faisant ainsi, la fenêtre s'ouvre chaque fois que l'on veut ouvrir une page sur le blog ce qui n'est pas très très pratique vous en conviendrez ;-)
Après vérification auprès de Aweber, ils m'ont dit de la mettre sur la "page" index.php mais cela ne fonctionne pas du tout.
Auriez vous la gentillesse de me dire dans quel endroit de l'éditeur je dois mettre cette ligne de commande pour que cette light box s'ouvre à l'ouverture du blog (pour un visiteur bien sur), une seule fois, et surtout à quel endroit de la page php.
Merci

Les relations humaines positives
Pour ceux qui ont des problèmes dans leur vie, leurs relations, leurs rêves et qui ne sont pas satisfait d'eux même...