Zoom Image Gallery + Carousel not working as expected

Home Forums Porto – Responsive HTML5 Template Zoom Image Gallery + Carousel not working as expected

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #10009891
    ljsimon
    Participant

    Hi!

    I’m trying to markup a Zoom Image Gallery + Carousel, but images appear stacked vertically. Zoom works as expected, and Safari tools don’t throw me javascript error.

    My markup:

    <div class="lightbox" data-plugin-options='{"delegate": "a", "type": "image", "gallery": {"enabled": true}, "mainClass": "mfp-with-zoom", "zoom": {"enabled": true, "duration": 300}}'>
              <div class="owl-carousel stage-margin" data-plugin-options='{"items": 5, "margin": 10, "loop": false, "nav": true, "dots": false, "stagePadding": 40}'>
                <div> <a href="/images/v2015/laboratorios/laboratorios-ambientales-1.jpg"> <img src="/images/v2015/laboratorios/laboratorios-ambientales-1.jpg" alt="Laboratorio de Ambientales" /> </a> </div>
                <div> <a href="/images/v2015/laboratorios/laboratorios-ambientales-2.jpg"> <img src="/images/v2015/laboratorios/laboratorios-ambientales-2.jpg" alt="Laboratorio de Ambientales" /> </a> </div>
                <div> <a href="/images/v2015/laboratorios/laboratorios-ambientales-3.jpg"> <img src="/images/v2015/laboratorios/laboratorios-ambientales-3.jpg" alt="Laboratorio de Ambientales" /> </a> </div>
                <div> <a href="/images/v2015/laboratorios/laboratorios-ambientales-4.jpg"> <img src="/images/v2015/laboratorios/laboratorios-ambientales-4.jpg" alt="Laboratorio de Ambientales" /> </a> </div>
                <div> <a href="/images/v2015/laboratorios/laboratorios-ambientales-5.jpg"> <img src="/images/v2015/laboratorios/laboratorios-ambientales-5.jpg" alt="Laboratorio de Ambientales" /> </a> </div>
              </div>

    #10009896
    Support
    Keymaster

    Hello,

    Could you please send me the URL of your site so I can check that problem?

    I made a quick test using the HTML you sent (just changing the images) and it worked well.

    Kind Regards,

    Jonas


    #10009919
    ljsimon
    Participant
    This reply has been marked as private.
    #10009938
    Support
    Keymaster

    Hello, looks like the CSS is not being loaded in the page.

    <link rel="stylesheet" href="vendor/owlcarousel/owl.carousel.min.css" media="screen">
    <link rel="stylesheet" href="vendor/owlcarousel/owl.theme.default.min.css" media="screen">

    So please download the theme again and update the folder vendor/owlcarousel.

    Please try that and let me know if you need further assistance.

    Kind Regards, Jonas


    #10009947
    ljsimon
    Participant

    OMG Why did I forget those files?!?!?!?

    Thanks!!! It works 🙂

    Greetings,
    LJ


Viewing 5 posts - 1 through 5 (of 5 total)

This topic is marked as "RESOLVED" and can not rceive new replies.