LAGIER priority asked 5 days ago


Comportement attendu**Bonjour, j'ai un problème avec la "lightbox" qui ne fonctionne pas sur un de mes sites et je n'arrive pas à le résoudre. La mise à jour a été faite vers **MDB 5 Vs: Pro 8.0.0 (CSS, JS, Module, etc.) Il y a la même configuration pour faire fonctionner la galerie ( MDB 5 Pro Vs: 8.0.0 sur tous les sites : Sur ce site ça marche parfaitement : https://www.ialpes.com/#galerie Sur ce site ça ne marche pas : https://www.ialpes.com/#galerie entrer la description du lien ici J'ai passé le code avec HTML Validator, rien de spécial sauf des attributs obsolètes "text/javascript". Depuis la barre du navigateur, je peux appeler les images : exemples : https://geneve.ialpes.com/img/cita/geneve-panorama-450.jpg (450x300) et https://geneve.ialpes.com/img/cita/geneve-panorama.jpg (780x520)

Ce qui est étrange, c'est que si je colle votre exemple, cela fonctionne parfaitement avec les mêmes codes CSS et JS. Auriez-vous un moment pour m'aider à résoudre mon problème ?

Les chemins sont bons. J'appelle le CSS comme ceci :

J'appelle le JavaScript comme ceci : :

<script src="../asset/js/modules/sidenav.min.js"></script> 
<script src="../asset/js/modules/navbar.min.js"></script>
<script src="../asset/js/modules/lightbox.min.js"></script>
  <script src="../asset/js/return-top.js"></script>

Merci. J'appelle le css comme ceci :

Comportement réel

Ressources (captures d'écran, extraits de code, etc.)


LAGIER priority answered 2 days ago


Kamila,

I finally found the problem of the Lightbox.

It seems that there is a bug somewhere. The Lightbox only works with 3 images, if I place 6 images, the Lightbox does not work anymore and I have no idea where this problem comes from.

For this, I have you can see the page with 3 images here: https://geneve.ialpes.com/hebergement/hebergements-a-geneve.html and the page with 6 images that does not work here: https://geneve.ialpes.com/index.html

All the codes are identical, CSS, JavaScript, links with images, custom CSS styles, etc...

Thank you


Kamila Pieńkowska staff commented 22 hours ago

They are not identical. I've written it before. You need to pass the correct image path to data-mdb-img. On the page where you have 6 images you provide in data-mdb-img. Make sure that it leads to an existing file. If you use a path that works you can see 6 images lightbox works. https://mdbootstrap.com/snippets/standard/kpienkowska/6279244


LAGIER priority answered 2 days ago


Galerie Photos
   <div class="col-lg-4 mb-4">  < !--  img 2  

< !-- img 3  < !-- END ROW 1 

   <div class="row">      < !--  START ROW 2   

< !-- img 1  < !-- img 2  < !-- img 3  < !-- END ROW 2 

My code:`

Galerie Photos
   <div class="col-lg-4 mb-4">  < !--  img 2  

< !-- img 3  < !-- END ROW 1 

   <div class="row">      < !--  START ROW 2   

< !-- img 1  < !-- img 2  < !-- img 3  < !-- END ROW 2  `


LAGIER priority answered 2 days ago


Hello Kamila,

Thanks for your help The paths to the images are correct. For src the image is a 450X300 pixel image, and for data-mdb-img, the called image is 780x520 pixels.

All my "Galleries", only the galleries, are made on this model of 780x520 px and 450x300 px. There may be better to do for the galleries. What bothers me is that using your model it works. The code is identical except the path of the small and large images on my site and that on MDB uses the same image.

Here is more information:

JS: mdb.umd.min.js MDB5* Version: PRO 8.0.0

I find this message and, see the screenshot, but in French, translated below. Syntax error on line 20 of mdb.umd.min.js. Code hints may not work until after this error is resolved.

If this helps?

Thank you and have a nice day.

Alainenter image description here


Kamila Pieńkowska staff answered 3 days ago


On the page, the lightbox does not work you have different paths to the image in src and data-mdb-img.


LAGIER priority answered 4 days ago


Hello Kamila, I hope you are well and thank you for taking the time to solve my problem. I have a problem with the "lightbox" that does not work on one of my sites and that I cannot solve. The update was made to version MDB 5 Pro 8.0.0 On one site the photo gallery works perfectly (zoom, scrolling) and on another site nothing happens. The configuration is the same on the sites, the same coding that I call like that and which are placed in an "asset" folder and the paths are correct. CSS between and

JavaScript before closing :

I ran the code with « HTML Validator », nothing special except obsolete attributes "text/javascript". On this site the lightbox works: https://www.ialpes.com/index.html#galerie On this site the lightbox does not work: https://geneve.ialpes.com/#galerie

I ran the code with "HTML Validator", nothing special except obsolete attributes "text/javascript". From the browser bar, I can call the images: examples: https://geneve.ialpes.com/img/cita/geneve-panorama-450.jpg (450x300) and https://geneve.ialpes.com/img/cita/geneve-panorama.jpg (780x520) The strange thing is that if I paste your example, it works perfectly with the same CSS and JS codes. Would you have a moment to help me solve my problem ? Thank you very much for your help. Alain


Kamila Pieńkowska staff answered 4 days ago


Please translate your question into English. We provide support for the international community and we want everyone to be able to use and understand the answer.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 8.0.0
  • Device: PC
  • Browser: All
  • OS: Windows 11
  • Provided sample code: No
  • Provided link: Yes