carousel - owl carousel 中的 href 无法在实时服务器上运行

Question

我正在使用一个owl carousel来显示一些图像和内容。内容将On Click重定向到相应的页面。它不能在实时服务器上运行，但在 localhost 上运行良好。

<div class="owl-carousel">
    <div class="item">
        <div class="product" style="border: #e1e1e1 solid 1px;">
            <div class="volunteer-thumb"> 
                <img src="https://fiverr-res.cloudinary.com/images/q_auto,f_auto/gigs/191485348/original/3445ddeeb76be7b8279be096c0912765a9ddd292/design-promotional-magazine-ad-newspaper-ad-flyer-or-print-advert-3d3a.jpg" alt="" class="img-fullwidth img-responsive" style="width:250px; height:150px;">
            </div>
            <div class="bg-lighter text-center pt-2">
                <div class="schedule-details clearfix p-5 pt-5">
                    <h5 class="font-12 title text-uppercase mt-5 mb-5">
                        <a href="https://google.com">Print</a>
                    </h5>
                </div>
            </div>
        </div>  
                
    
        <script>
            $('.owl-carousel').owlCarousel({
                loop:true,
                margin:10,
                autoplay:true,
                nav:true,
                navText: [
                    '',
                    ''
                ],
                responsive:{
                    0:{
                        items:1
                    },
                    600:{
                        items:3
                    },
                    1000:{
                        items:5
                    }
                }
            })
        </script>

    </div>
</div>

这是该代码的jsfiddle： https ://jsfiddle.net/xjrdug08/2/

标签： carouselowl-carousel