MDB-pro lightbox - clicking on images openes the link of the


Topic: MDB-pro lightbox - clicking on images openes the link of the image instead of the light box

MichalBKuber pro asked 1 months ago

I bought MDB pro just for this, I need help. Thank you!

The when I click on the images the image link ( the href of the a tag ) is opened instead of the gallery.

  1. Please advise
  2. Please add exactly what scripts/links need to be added into the html / JS in order for this to work properly.

Thank you,Michal Kuber

Mateusz Łubianka staff answered 1 months ago

Hi @MichalBKuber,

If you have included all css and js MDB files, you should only initialize the lightbox. Lightbox docs: You should to include: In HTML Head:

<link rel="stylesheet" href="">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/mdb.min.css">

Before closing Body tag:

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/popper.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/mdb.min.js"></script>

And in your custom js file or 'scripts' tags:

$(function () {$("#mdb-lightbox-ui").load("mdb-addons/mdb-lightbox-ui.html")});

Here you can see our installation guide:


MichalBKuber pro answered 1 months ago

Hi @Mateusz Łubianka I did all above. I'm still seeing the same issue in me code of the image href opening in the browser.

I think maybe a different script I have in my project is causing the a tag to redirect to it's href value. Is there some function I can use to call the lightbox in order for this not to happen? Maybe something along the lines of :

 $( ".mdb-lightbox a" ).on('click' ,function(event) {

Waiting to hear back from you. Thank you! Michal Kuber

Mateusz Łubianka staff commented 1 months ago


It is hard to help without seeing a code. please, create a snippet showing your problem here: I'll try to help you.


MichalBKuber pro commented 1 months ago

Hi, I started creating a code snippet, and I realized the JS scripts were not at the bottom of the body tag. So this is working now. Thanks for your help!

Mateusz Łubianka staff commented 1 months ago


I'm glad everything works :)


Please insert min. 20 characters.


Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: jQuery
  • MDB Version: 4.11.0
  • Device: Lenovo
  • Browser: Chrome
  • OS: windows 10
  • Provided sample code: No
  • Provided link: No