CODEWITHSUNDEEP
javascriptjquerycsssliderowl-carousel
Sahin
Sahin

Reputation: 11

Owlcarousel set display none when it is uploaded on server

I am trying to set an owl carousel on my landing page . It works fine when i browse it from my working directory . But when i upload it on server (even in local server) it set display:none in css . I tried changing css and js files but it is not working .

here is my code --- 

$(document).ready(function(){
  jQuery("#main-slider").owlCarousel({
	autoplay:true,
	loop:true,	
	animateOut: 'fadeOut',
    animateIn: 'fadeIn',
    items:1,
    margin:30,
    stagePadding:30,
    smartSpeed:450
  });
});
<div id="main-slider" class="owl-carousel owl-theme">
    <div class="item"> 
      <img src="img/slider.jpg" alt="" />
    </div> 
    <div class="item"> 
      <img src="img/slider2.jpg" alt="" />
    </div> 
    <div class="item"> 
      <img src="img/slider3.jpg" alt="" />
    </div>
  </div>

Upvotes: 1

Views: 1083

Answers (1)

srkn sltrk
srkn sltrk

Reputation: 418

If you've used #main-slider id more than once on this page you can get error. Use it once.

Upvotes: 2

Related Questions