Second Project, lightbox not working properly

1

Hola :slight_smile:

I am a newbie and I am on my second portfolio project.

As you know the project is about creating a portfolio and I am trying to achieve this using lightbox. The problem is that it seems not to be working, I googled the issue extensively and looked it up here before asking but I couldn’t find a way to fix this.

When I click a thumbnail in the portfolio section I get the following error on the console and lightbox is not firing:

ekko-lightbox.js:89 Uncaught TypeError: Cannot read property ‘Constructor’ of undefined
at new Lightbox (ekko-lightbox.js:89)
at HTMLAnchorElement. (ekko-lightbox.js:660)
at Function.each (jquery.min.js:2)
at r.fn.init.each (jquery.min.js:2)
at r.fn.init._jQueryInterface [as ekkoLightbox] (ekko-lightbox.js:655)
at HTMLAnchorElement. (gGydGd:158)
at HTMLDocument.dispatch (jquery.min.js:3)
at HTMLDocument.q.handle (jquery.min.js:3)

Here is the link to the project.
https://codepen.io/dalux21/pen/XzWzwV

Hope someone will be able to help me fix this. :slight_smile:

Thanks,

1 Like
2

Hola,

I think I found a solution. I don’t think the lightbox is working with the beta version of bootstrap.

I changed the bootstrap v4 CSS and JS files to these:

“https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css”

“https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js”

Those are straight from bootstrap’s docs.

The lightbox seems to work after that.

Here’s a forked version of your pen: https://codepen.io/jon-0/pen/GORyQo

You may still see some errors in the console, though.
Hope that helps!

3

Hi Jon-o,

Thanks a lot, I’ll have a look at the Fork and change the files :slight_smile:

Do you reckon it would be better to stick to the beta and build a gallery on my own using Modal?
I would like to go past this step to get a bit more into JS and the next chapters, that’s why I was trying to use a plugin like lightbox.

4

You can if you’d enjoy doing that!

There’s a lot to learn out there, so it just depends what you want to do.
If you want to feel more comfortable with the current knowledge you have, it’s a good idea to solidify your learning by continuing to work on this project.

On the other hand, you can continue learning new things and there will be more projects as you continue.

It’s really your choice! Sometimes it makes more sense to drill down on one thing. When you feel ready, you can always continue learning new things.

  • jon-0
5

I have the exact same problem, but Bootstrap 4 isn’t in Beta anymore. Did I misunderstand the answer? Any help is appreciated. My error is…

Uncaught TypeError: Cannot read property ‘Constructor’ of undefined
at new Lightbox (ekko-lightbox.js:89)
at HTMLAnchorElement. (ekko-lightbox.js:660)
at Function.each (jquery.min.js:2)
at m.fn.init.each (jquery.min.js:2)
at m.fn.init._jQueryInterface [as ekkoLightbox] (ekko-lightbox.js:655)
at HTMLAnchorElement. (favorites.html:1785)
at HTMLDocument.dispatch (jquery.min.js:3)
at HTMLDocument.r.handle (jquery.min.js:3)
Lightbox @ ekko-lightbox.js:89
(anonymous) @ ekko-lightbox.js:660
each @ jquery.min.js:2
each @ jquery.min.js:2
_jQueryInterface @ ekko-lightbox.js:655
(anonymous) @ favorites.html:1785
dispatch @ jquery.min.js:3
r.handle @ jquery.min.js:3