package.docs.demos.rtl.html Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of owl.carousel Show documentation

Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.

The newest version!



  

    
    
    
    
    
    
    
      RTL Demo | Owl Carousel | 2.3.4
    

    
    
    

    
    
    

    

    

    
    
    
    

    

    
    
    
  
  

    
    
      
        
          
            
              owl.carousel.js 
            
          
          
               
           
          
            
               Home  
              
                Demos 
              
               Docs  
              
                Download 
                 
              
            
          
        
      
    

    
    
      
        
          Right To Left
        
      
    

    
    
      
        
          
            
              1
            
            
              2
            
            
              3
            
            
              4
            
            
              5
            
            
              6
            
            
              7
            
            
              8
            
            
              9
            
            
              10
            
            
              11
            
            
              12
            
          
          Overview
          By adding rtl:true Owl will change direction from Right to left.
          Default:
          rtl: false
          Setup
          $('.owl-carousel').owlCarousel({
    rtl:true,
    loop:true,
    margin:10,
    nav:true,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:5
        }
    }
})
          html
          <div class="owl-carousel owl-theme">
    <div class="item"><h4>1</h4></div>
    <div class="item"><h4>2</h4></div>
    <div class="item"><h4>3</h4></div>
    <div class="item"><h4>4</h4></div>
    <div class="item"><h4>5</h4></div>
    <div class="item"><h4>6</h4></div>
    <div class="item"><h4>7</h4></div>
    <div class="item"><h4>8</h4></div>
    <div class="item"><h4>9</h4></div>
    <div class="item"><h4>10</h4></div>
    <div class="item"><h4>11</h4></div>
    <div class="item"><h4>12</h4></div>
</div>
          
        
      
    

    
    
      
        
          
            David Deutsch