JS Class Slider

@Directi

by ajinkyax

HTML

<div class="slider" id="slider">
    <ul>
      <li><img src="http://placekitten.com/300/300" alt="Kitten" /></li>
      <li><img src="http://placekitten.com/300/300" alt="Kitten" /></li>
      <li><img src="http://placekitten.com/300/300" alt="Kitten" /></li>
      <li><img src="http://placekitten.com/300/300" alt="Kitten" /></li>
      <li><img src="http://placekitten.com/300/300" alt="Kitten" /></li>
    </ul>
    <div class="controls">
      <a href="#" class="left">Left</a>
      <a href="#" class="right">Right</a>
      <span></span>
    </div>
  </div>

CSS

.slider {
  width: 300px;
  overflow: hidden;
}

.slider ul {
      display: block;
  height: 300px;
  list-style: none;
  padding: 0;
    }

.slider ul li {
  width: 300px;
  height: 300px;
  float: left;
}