19

I cannot for the life of me get rid of them:

dots: false,

Doesn't do anything?

JSHD
  • 307
  • 1
  • 4
  • 7

6 Answers6

38

Since you are using OwlCarousel version 1, please check out their documentation. This also says pagination (dots) can be turned off with:

pagination: false,

The dots: false, is for version 2. See this GitHub issue which is asking the same question.

B_s
  • 3,026
  • 5
  • 32
  • 51
  • Cheers. Also, how do I get rid of the grey around my image if I use left and right arrow images for "navigationText"? – JSHD Oct 26 '15 at 23:21
  • @JSHD No problem. Please mark my answer as correct if this solved your issue, so others can benefit from it as well. I'll check on the grey borders in a sec. – B_s Oct 26 '15 at 23:22
  • @JSHD I'm not sure if there's a boolean attribute to delete the grey area around the slider. You could do this with css possibly, but maybe it's better if you make a new Question for that particular issue. – B_s Oct 26 '15 at 23:24
20
<pre>
<code>

    <script type="text/javascript">
        $(document).ready(function(){
            $('.owl-carousel').owlCarousel({
                dots: false,
            });
        });
    </script>

</code>
</pre>
Dev-iL
  • 23,742
  • 7
  • 57
  • 99
Ashish Kumar
  • 201
  • 2
  • 4
  • While this code possibly answers the question, providing additional [context](https://meta.stackexchange.com/q/114762) regarding _how_ and/or _why_ it solves the problem would improve the answer's long-term value. It also doesn't hurt to mention why this answer is more appropriate than others. – Dev-iL Mar 19 '17 at 21:17
5

Try as below:

$('.owl-carousel').owlCarousel({
  nav: false,
  dots: false,
.....
..
Rahul Gupta
  • 9,775
  • 7
  • 56
  • 69
Rajesh Doot
  • 61
  • 1
  • 2
4

For version 2 you can use the dots property.

$(document).ready(function(){
  $('.owl-carousel').owlCarousel({
    // ... other properties
    dots: false,
    // ... other properties
  });
});
Amit
  • 244
  • 1
  • 2
  • 11
0

Try as below:

<script type="text/javascript" >
        require(['jquery','owlcarousel'], function($){
            $(document).ready(function() {
               $('#feature_product').owlCarousel({
                    margin: 10,
                    dots:false,
                    loop: true,
                    autoplay: true,
                    autoplayTimeout:300,
                    slideSpeed : 200,
                    responsiveClass:true,
                    responsive:{
                        0:{
                            items:1,
                            nav:true
                        },
                        600:{
                            items:3,
                            nav:true
                        },
                        1000:{
                            items:5,
                            nav:true,
                            loop:true
                        },
                    }
                });

              });
        });

    </script>
Rakesh Patel
  • 1
  • 1
  • Hey Rakesh - Can you please add some details/description before your code snippet. That will be very helpful for the asker as well as the community to understand your post fully. – RBT Feb 28 '20 at 05:22
0

$(".carousel1").owlCarousel({ margin: 20, loop: true, autoplay: true, autoplayTimeout: 2000, autoplayHoverPause: true, nav: false, dots: false, responsive: { 0:{ items:1, nav: false }, 600:{ items:2, nav: false }, 1000:{ items:3, nav: false } } });

Jaime Tarazona
  • 1
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Mar 22 '22 at 04:15