owl-carousel

So i have an Owl Carousel that contains three images. I also added custom navigation arrows (.png images) on left and right sides. However, those arrows are currently useless, because I can't find a way to actually make them switch between images of my Owl Carousel. I searched endlessly and can't find the solution. Any ideas? You need to enable navigation and edit navigationText: > Assuming this is version 1.3.2 owlgraphic.com/owlcarousel/#customizing Note : It appears the site for Owl 1.3 is now down, so here is a forked Codepen example . $("#owl-example").owlCarousel({ navigation: true,

Is there a way to disable the previous and next links if there aren’t enough items to scroll? For example: http://truewest.nextmp.net/special-programs these galleries allow for 4 items (desktop), there are only 4 items in this gallery but the buttons to pagination still appear, but should be disabled. I know there was a way to do it in the previous version, but the .disabled class doesn’t load into the links on this one? I don’t see it doing so in any of the demos either... Could I use some additional jquery to override this, or is there anything built-in I that I'm missing? Here is my code: $

I use Owl-carousel 2. I use standard code of initialization and markup of Owl-carousel 2. At the first load of page the work of carousel is perfect. Owl-carousel 2 stop the work when I pass in browser to another page and back or minimize browser and again open page with Owl-carousel 2. New start of carousel when I again click navigation. I had try to place in body of html code of initialization of carousel again: var $carousel = $('.owl-carousel'); var owl = $carousel.data('owlCarousel'); owl.trigger("refresh.owl.carousel"); But it is not working. Autoplay need to run but it is not working.

I use owl carousel plugin, can't find how to let navigation vertical align center, with option autoHeight. http://codepen.io/anon/pen/jJAHL I tried like below, but it only get last height. $(this_gallery).owlCarousel({ singleItem: true, autoHeight : true, navigation:true, // autoPlay : 2000, stopOnHover : true, afterAction: function() { var center_height = $(this_gallery).find('.owl-wrapper-outer').height(); console.log(center_height); // $(this_gallery).find('.owl-buttons').css('top', center_height); } }); Instead of giving top position in the pixel give it in the percentage like following:

I have repeater control to show something. <div class="owl-carousel trend" style="height:20px;"> <asp:Repeater ID="rptThing" runat="server" DataSourceID="yyy"> <ItemTemplate> <asp:LinkButton ID="lnkEtiket" runat="server" OnClick="lnkEtiket_Click">go</asp:LinkButton> </ItemTemplate> </asp:Repeater> </div> It's inside of an updatepanel. No problem on page load but when onClik it disappears. I know it about ajax & jquery issue but I couldn't solve problem. I tried so many examples. Here is my jquery <script type=text/javascript> var owltrend = $('.trend'); owltrend.owlCarousel({ margin: 5, loop:

I am using OWL Carousel and I have coded it so there will be one image displayed and then every 15 seconds the next image will slide in. I have set the width to be 100% of the screen so and coded the js appropriately so in theory there should be ONE image at a time at full size....however what happens is it shows all the images rather small and then if i resize the screen even 1 pixel it snaps into how it should be..... any idea on how to avoid having to resize the screen to get the image to be full sized ? Here is my HTML <div class="owl-carousel"> <img src="assets/background1.jpg" /> <img