owl-carousel

问题 I have searched for a solution, but I haven't found a problem same as mine... I have different sections on my page, which are floating outside view, each section floats into view if you click on the menu-link. The owl carousel is one extra section...The problem now is, that when I am on the home-section for example and I resize the window. If I then let the the slider-section float into view, the owl-carousel is all broken. If I then resize the window again, the carousel is reloaded and

问题 Have a slide build on owl carousel. Have tried to add feature lazy load to the image. Below is my image tag written in html and its not showing the first image in the slide. <img class="multilink-image owl-lazy" data-src="{{ ::mycontroller.src }}"> In my browser it seams the above tag becomes as. <img class="multilink-image owl-lazy" data-src="//www.sampel.com/media/test.jpg" src="{{ ::mycontroller.src }}"> The src tag is not updating the value. But on sliding the second image onwards its

问题 I know that there is the possibility to jump to a certain position in the owl carousel by current position-number. Like: $('.jumpTo').click(function(){ carousel.trigger('owl.jumpTo', 3) }); Would it be possible to jump to matching ID? Let's assume that I have a site with thumbnails and the click on one of them opens a modal with the owl carousel beeing at the right/matching position. Something like: var myattr = $(this).attr('subcategory'); $('.jumpTo').click(function(){ carousel.trigger('owl

问题 Please can someone help I have tried to implement 3 kinds of carousels and nothing is working: http://owlgraphic.com/owlcarousel/ http://slidesjs.com/ http://responsiveslides.com/ Nothing works, I have added the JS and CSS like this: <!-- CSS ================================================== --> {{ 'timber.scss.css' | asset_url | stylesheet_tag }} {{ 'theme.scss.css' | asset_url | stylesheet_tag }} {{ 'index.css' | asset_url | stylesheet_tag }} {{ 'owl.css' | asset_url | stylesheet_tag }} {{

问题 Please can someone help I have tried to implement 3 kinds of carousels and nothing is working: http://owlgraphic.com/owlcarousel/ http://slidesjs.com/ http://responsiveslides.com/ Nothing works, I have added the JS and CSS like this: <!-- CSS ================================================== --> {{ 'timber.scss.css' | asset_url | stylesheet_tag }} {{ 'theme.scss.css' | asset_url | stylesheet_tag }} {{ 'index.css' | asset_url | stylesheet_tag }} {{ 'owl.css' | asset_url | stylesheet_tag }} {{

问题 My Owl Carousel contains pictures of different width and height. How do I align them in the middle - both horizontally and vertically? $("#owl-example").owlCarousel({ navigation: true }); <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.css"> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.theme.min.css"> <div id="owl-example" class="owl-carousel"> <div><img src="//placehold.it/120x120/69c/fff/" alt=""></div

问题 I'm using owlcarousel 2 with lazyload options true, i want to start preloading of next slides images in background while user seeing first image of carousel so user doesn't see the loader and directly see the loaded image in next slides here is my html code <div class="inner-gallery"> <div id="inner-gallery"> <div class="gallery-item"> <div class="gallery-item2"> <img class="lazyOwl" data-src="<?php echo $image[0]; ?>" alt=""/> </div> </div> </div> </div> here is my javascript code $(document

问题 I have managed to get Owl Carousel working perfectly on my Magento home page using div's of images. My aim is to get it wortking with products but I am struggling. I want to display the products from a particular category and show them on the home page using the Owl Carousel but I usually call products on to the home page using a cms block with code such as: {{block type="catalog/product_list" category_id="112" column_count="4" template="catalog/product/list.phtml"}} This obvioulsy is not

问题 I'm currently using Owl Carousel 2 and combining it with this filtering example to create a filter menu that when titles in the filter menu list are clicked all other items in the carousel disappear. This works really well except that when SHOW is clicked and all items return to the carousel they are not in the order they started. Owl Carousel 2 http://www.owlcarousel.owlgraphic.com/docs/api-options.html Filter http://www.xcast3d.com/spotlight/bootstrap-carousel-filter/ I need them to keep

问题 I am using Owl Carousel 2. I want to load Owl Carousel inside the Bootstrap Accordion panel. My code goes like this... HTML CODE: <div class="panel-group users_block_accordion" id="accordion" role="tablist" aria-multiselectable="true"> <div class="panel panel-default"> <div class="panel-heading" role="tab" id="headingTwo"> <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#usersPanel" aria-expanded="false" aria-controls="collapseTwo"> <h4 class="panel