LightBox controls are missing


Topic: LightBox controls are missing

KaydeeWeb pro asked 7 years ago

 

Hi there

I want to use the MDBootstrap Lightbox, I have tried everything!

I am pretty sure it is to do with the JS that I am pulling in, as I've included the following in an external file, but whether it is there or not the LightBox does the same thing.

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

The image opens and there are no controls, no close button, no left or right scroll. I have done this on a development site, and also uploaded it to a live server. Could you help please, and thank you in advance.

A dev site is resting here at present: http://coleman-architecture.co.uk/newwebsite/residential-architecture.php


KaydeeWeb pro commented 7 years ago

I've even added the LightBox Gallery example here https://mdbootstrap.com/javascript/lightbox/ to the MDB 4.5.0 example index.html file to test it. Still no controls on the LightBox. Help!

Mikołaj Smoleński staff answered 7 years ago

Hello KaydeeWe, It looks like the lightbox is not loading at all. Please send me Your zipped project to m.smolenski@mdbootstrap.com. Regards

KaydeeWeb pro commented 7 years ago

Thank you! It is coming over. K

Ollie Vincent pro commented 7 years ago

Are you able to confirm what version of mdb you are using? They changed alot of syntax for 4.5

RPICKUL commented 7 years ago

Was there any resolution for this problem? I'm facing a similar issue over here.

Mikołaj Smoleński staff commented 7 years ago

There were in fact three fixes for that problem. I'll copy them here. Maybe You'll find them helpfull. 1. First of all, the skin was not loading because of Your style.min.css file. Please add our mdb.css separetely to header and then Your own styles in other file. 2. Secondly, include the mdblightox.js in Your footer - I am not sure if it was included. In that file it should be: $(function () { $("#mdb-lightbox-ui").load("../src/mdb-addons/mdb-lightbox-ui.html"); }); 3. Then our gallery from mdbootstrap page is working. Please check Your figures if they are correct. Regards

Mikołaj Smoleński staff commented 7 years ago

You can also try to replace mdb.min.js by mdb.js file. Sometimes it causes problems.

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
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes