Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Voir le sujet précédent Voir le sujet suivant Aller en bas

En cours Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Lun 13 Aoû 2018 - 18:08

Bonjour Forumactif

J'aurais besoin d'aide SVP car j'aimerais pouvoir installer un code de Fancybox ou Lightbox pour visualiser les images que je partage sur mon Forum.

Exemple de Fancybox ou Lightbox:
#1 http://www.transformers-fans.world/dna-design-dk-09-ss-megatron-upgrade-kit/
#2 http://news.tfw2005.com/2018/08/12/transformers-power-of-the-primes-wave-4-deluxe-novastar-spotted-at-us-retail-370017

J'ai pu le faire pour mon html (exemple), mais j'aimerais l'appliquer dans les messages sur le forum à l'aide de "Feuille de style CSS" + "Gestion des codes Javascript".

Y aurait-il quelqu'un qui pourrait m'aider?

Si oui, quel code HTML à ajouter dans les messages du forum que je ferai pour que la galerie Fancybox ou Lightbox fonctionne.

Merci d'avance.


Mon forum: http://www.transformersfr.com/forum

P.S.: J'ai essayé ce code: https://help.forumotion.com/t115826-add-a-lightbox-effect-to-the-images-of-the-forum
Mais malheureusement je n'ai pas le code HTML à ajouter dans ses messages du forum pour que la galerie marche.


Dernière édition par superhomme le Ven 24 Aoû 2018 - 20:57, édité 1 fois
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mar 14 Aoû 2018 - 16:34

petit up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mer 15 Aoû 2018 - 18:31

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Jeu 16 Aoû 2018 - 21:11

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Ven 17 Aoû 2018 - 8:01

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Lun 20 Aoû 2018 - 18:11

up merci
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mar 21 Aoû 2018 - 17:12

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mer 22 Aoû 2018 - 16:57

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Jeu 23 Aoû 2018 - 20:13

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par *Splash* le Jeu 23 Aoû 2018 - 21:28

Hi,

Ce lien sans doute : http://fancybox.net/howto
avatar

*Splash*
*****

Masculin
Messages : 515
Inscrit(e) le : 25/02/2018

https://splashforum.com
*Splash* a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par *Splash* le Jeu 23 Aoû 2018 - 21:34

avatar

*Splash*
*****

Masculin
Messages : 515
Inscrit(e) le : 25/02/2018

https://splashforum.com
*Splash* a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Ven 24 Aoû 2018 - 20:50

Salut Splash

Ton coup de pouce m'a amener à trouver sur une piste et après quelques essais-erreurs, j'ai trouvé une solution.

Je vais l'expliquer pour les futures intéressés s'ils/elles tombent sur mon sujet.

D'abord, dans le template "overall_header", en dessous de
Code:
<script src="{JQUERY_PATH}" type="text/javascript"></script>
...J''ai ajouté ce code:
Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.3.5/jquery.fancybox.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.3.5/jquery.fancybox.min.css" />

Et j'ai effacé ceci:
Code:
<!-- BEGIN switch_recent_jquery -->
    <script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
    <script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
    <script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
    <!-- END switch_recent_jquery -->

C'est ton lien https://help.forumotion.com/t153351-lightbox-effect-to-the-images qui m'a mis sur la piste. Wink


Ensuite, dans chaque message sur le forum que j'écrirais, voici le code html pour mettre les images:
Code:
<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>

J'ai trouvé ça ici: http://fancyapps.com/fancybox/3/, à partir de ton lien http://fancybox.net/howto


Bref ça marche aussi simple que ça et c'est normal que je partage ma solution. Smile


Dernière édition par superhomme le Ven 24 Aoû 2018 - 22:02, édité 2 fois
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Ven 24 Aoû 2018 - 20:59

Il marche nickel mon code sur phpBB2.

Par contre, il semble avoir un glicht sur ModernBB, quand on clic sur l'image, elle bouge quelques seconde tout seul, voyez vous même via mon forum qui sert de test: http://transf.kanak.fr/t8-test-images


Dernière édition par superhomme le Ven 24 Aoû 2018 - 21:01, édité 1 fois
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par *Splash* le Ven 24 Aoû 2018 - 20:59

@superhomme a écrit:
Ensuite, dans chaque message sur le forum que j'écrirais, voici le code html pour mettre les images:
Code:
<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>

J'ai trouvé ça ici: http://fancyapps.com/fancybox/3/, à partir de ton lien http://fancybox.net/howto


Bref ça marche aussi simple que ça et c'est normal que je partage ma solution. Smile

Ce qui n'est pas top c'est que tu seras le seul à pouvoir poster des images avec l'effet, les membres n'auront pas tous l'astuce et il y aura ceux qui ne voudront pas rajouter ce code.

J'aurais laissé ce sujet en non résolu afin que quelqu'un y laisse un code js afin que l'effet soit actif en postant un lien image sans ajout supplémentaire de balises de code.
avatar

*Splash*
*****

Masculin
Messages : 515
Inscrit(e) le : 25/02/2018

https://splashforum.com
*Splash* a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par *Splash* le Ven 24 Aoû 2018 - 21:03

@superhomme a écrit:Il marche nickel mon code sur phpBB2.

Par contre, il semble avoir un glicht sur ModernBB, quand on clic sur l'image, elle bouge quelques seconde tout seul, voyez vous même via mon forum qui sert de test: http://transf.kanak.fr/t8-test-images

Effectivement il y a un légé mouvement avant que l'image soit agrandit
avatar

*Splash*
*****

Masculin
Messages : 515
Inscrit(e) le : 25/02/2018

https://splashforum.com
*Splash* a été remercié(e) par l'auteur de ce sujet.
  • 0

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Ven 24 Aoû 2018 - 21:09

@*Splash* a écrit:Ce qui n'est pas top c'est que tu seras le seul à pouvoir poster des images avec l'effet, les membres n'auront pas tous l'astuce et il y aura ceux qui ne voudront pas rajouter ce code.

J'aurais laissé ce sujet en non résolu afin que quelqu'un y laisse un code js afin que l'effet soit actif en postant un lien image sans ajout supplémentaire de balises de code.

J'ai édité mon message en non résolu vu que j'ai remarqué un bogue en version ModernBB alors qu'en phpBB2, phpBB3, PunBB & Invision ça marche.

Tu as raison de dire que seul moi saura fait cette effet avec mes images même si je partage le code html avec mes membres. La fonction n'est pas intégré sur le panneau de message sur forumactif actuellement.

Effectivement, faudrait qu'un pro du code Javascript est une solution alternative pour que ça soit automatique quand un membre écrit un message.


@*Splash* a écrit:
*superhomme* a écrit:Il marche nickel mon code sur phpBB2, phpBB3, PunBB & Invision.

Par contre, il semble avoir un glicht sur ModernBB, quand on clic sur l'image, elle bouge quelques seconde tout seul, voyez vous même via mon forum qui sert de test: http://transf.kanak.fr/t8-test-images

Effectivement il y a un légé mouvement avant que l'image soit agrandit

Ça marche nickel sur mon site web... bref quelque chose dans la version ModernBB entre en altercation avec le code Fancybox, alors que phpBB2, phpBB3, PunBB & Invision aucun soucis. Bref seul un employé de Forumactif pourrait répondre à ça probablement.
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par *Splash* le Sam 25 Aoû 2018 - 0:52

Re,

Ajoute ce code js sur "Les sujets"

Code:
$(function(){
var img=$("img"), len=img.length, i=0;
for(i;i<len;i++){
img.eq(i).wrap("<a data-fancybox="gallery" href=""+img.eq(i).attr("src")+""></a>")
};
});

L'effet sur l'image fonctionne

http://testmodernbb.forumactif.com/t2-lightbox-image#2

Le seul inconvénient c'est qu'au lieu de concerner l'mage en question ça met en route un diaporama de toutes les images de la page
avatar

*Splash*
*****

Masculin
Messages : 515
Inscrit(e) le : 25/02/2018

https://splashforum.com
*Splash* a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mar 28 Aoû 2018 - 22:22

Merci *Splash* pour ton aide, ça fait un moyen de plus pour l'affichage.

Mais le bogue demeure malheureusement sur ModernBB (déplacement rapide de l'image au clic) sur les grandes images (marche nickel mon code sur phpBB2, phpBB3, PunBB & Invision.)

Bref, il semblerait que peut-être seul un staff de forumactif pourrait répondre à ça je pense.
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par Chacha le Mer 5 Sep 2018 - 9:41

Bonjour,

Attention, cela fait 8 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
avatar

Chacha
Modéractif
Modéractif

Masculin
Messages : 57488
Inscrit(e) le : 21/08/2010

https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Jeu 6 Sep 2018 - 9:14

@superhomme a écrit:RAPPEL DE MON SOUCIE: Le bogue (déplacement rapide de l'image au clic d'agrandissement) existe malheureusement que sur ModernBB et AwesomeBB.

Alors que mon code marche nickel sur phpBB2, phpBB3, PunBB & Invision.

Bref, seul un employé de Forumactif pourrait trouver l'erreur dans leur codage ModernBB et AwesomeBB.

Voici le lien TEST-IMAGE: http://transf.kanak.fr/t9-ok#19

Merci d'avance à ceux qui trouveront la réponse.

Up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

En cours Re: Diaporama pour visualiser les images dans les messages (fancybox ou lightbox)

Message par superhomme le Mer 12 Sep 2018 - 21:46

up
avatar

superhomme
***

Masculin
Messages : 105
Inscrit(e) le : 24/11/2008

http://transformers.1fr1.net/
superhomme a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum