# One Item with Image

# Setup

In order for the images to auto fit to slider containers use width 100% on . Check CSS below

    $(document).ready(function() {

      $("#owl-demo").owlCarousel({

          navigation : true, // Show next and prev buttons
          slideSpeed : 300,
          paginationSpeed : 400,
          singleItem:true

          // "singleItem:true" is a shortcut for:
          // items : 1,
          // itemsDesktop : false,
          // itemsDesktopSmall : false,
          // itemsTablet: false,
          // itemsMobile : false

      });

    });

    <div id="owl-demo" class="owl-carousel owl-theme">

      <div class="item"><img src="assets/fullimage1.jpg" alt="The Last of us"></div>
      <div class="item"><img src="assets/fullimage2.jpg" alt="GTA V"></div>
      <div class="item"><img src="assets/fullimage3.jpg" alt="Mirror Edge"></div>

    </div>

    #owl-demo .item img{
        display: block;
        width: 100%;
        height: auto;
    }

# More Demos

### Images

### Full Width

### Custom

### One Slide

### JSON

### JSON Custom

### Lazy Load

### Auto Height