11. 第十一週 OWL.CAROUSEL.JS (下)

1. 選項：http://www.owlcarousel.owlgraphic.com/docs/api-options.html

   <script type="text/javascript">
   	  $(document).ready(function(){
   		$('.owl-carousel').owlCarousel({
   			loop:true,//循環
   			margin:10,//邊距
   			nav:true,//導航
   			dots:false,//導航點
   			responsive:{
   				0:{
   					items:1//數量
   				},
   				600:{
   					items:2
   				},
   				1000:{
   					items:3
   				}
   			}
   		})
   	  });
   
   	</script>

    

2. css

   
     <style>
       .owl-carousel {
         position: relative;
       }
       .owl-prev,
       .owl-next {
         position: absolute;
         top: 50%;
       }
   
       .owl-theme .owl-controls .owl-nav [class*=owl-] {
          margin-top: -20px; // 按鈕高度的一半
       }
       .owl-prev {
         left: -50px;
       }
       .owl-next {
         right: -50px;
       }
   
     </style>

   
    
3.