Topic: Lightbox not working
Hello
I have tried to use this code in the script to load lightbox
"// MDB Lightbox Init
$(function () {
$("#mdb-lightbox-ui").load("mdb-addons/mdb-lightbox-ui.html");
});"
But image wont zoom on jQuery 3.3.1, only on 3.2.1, and the next and previous arrows dont show up. I use the downloaded mdb package index.html file to write code in.
Regards
You need to use a live server. There's a lot of ways to do that so it's up to you what to use. If you're a Windows user, I recommend you to use xampp or live-server
Ole Petter free commented 5 years ago
Ok. Thank you for your help!
Ole Petter free commented 5 years ago
I have started the live server now. It works perfectly. Thanks
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.5.15
- Device: Computer
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: No
Bartłomiej Malanowski staff commented 5 years ago
Our lightbox works well with jQuery 3.3.1 - I've checked it yesterday. Do you use live-server or you just opened the index.html in your browser?
Ole Petter free commented 5 years ago
I opened the index.html file in chrome. Is there some reference I am missing in the script perhaps? here are my linked scripts and stylesheets:
Stylesheets:
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="css/mdb.min.css" rel="stylesheet">
<!-- Your custom styles (optional) -->
<link href="css/style.css" rel="stylesheet">
---------------------------------------------------
Scripts:
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="js/mdb.min.js"></script>
<script type="text/javascript">
// MDB Lightbox Init
$(function () {
$("#mdb-lightbox-ui").load("mdb-addons/mdb-lightbox-ui.html");
});
</script>