Quick & dirty modern slide show.

HTML

<div id="slide-show"></div>

CSS

img {
    width: 600px;
    height auto;
}

JavaScript

var speed = 4; //sec

// Your image array
var images = [
    'http://www.gettyimages.co.uk/gi-resources/images/Homepage/Category-Creative/UK/UK_Creative_462809583.jpg',
    'http://www.hdwallpapersimages.com/wp-content/uploads/images/Child-Girl-with-Sunflowers-Images.jpg',
    'http://www.gettyimages.co.uk/CMS/StaticContent/1391099215267_hero2.jpg'];

// Get the slideShow tag
var slideShow = document.getElementById('slide-show');

// Create the image tag  //You could also just make one in HTML and get the tag
var img = document.createElement('img');

// Append the image to the slideshow container
slideShow.appendChild(img);

// Basic request animation polyfill 
var rAF = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || function (callback) {
        return setTimeout(callback, 1000 / 60);
    };

// declare var count outside of rAF loop
var count;

function changeImage(timeStamp) {
    count = Math.floor(timeStamp / 1000 / speed);

    while (count > 2) {
        count -= 3;
    }

    img.src = images[count];

    rAF(changeImage);
}

rAF(changeImage);