jQuery image slider rotator

Very basic jQuery image sliding rotator

by Emmanuel Garcia

HTML

<div id="slider"> <a href="http://placehold.it/">
            <img src="http://placehold.it/350x150&text=Slide+1"/>
        </a>
 <a href="#">
            <img src="http://placehold.it/350x150&text=Slide+2"/>
        </a>
 <a href="#">
            <img src="http://placehold.it/350x150&text=Slide+3"/>
        </a>
 <a href="#">
            <img src="http://placehold.it/350x150&text=Slide+4"/>
        </a>
 <a href="#">
            <img src="http://placehold.it/350x150&text=Slide+5"/>
        </a>
<a href=# ">
            <img src="http://placehold.it/350x150&text=Slide+6 "/>
        </a>
    </div>

CSS

#slider a {
    display: none;
}

JavaScript

$(document).ready(function () {

    $("#slider a").first().show();

    var index = 0;
    var count = 5;

    function bannerRotator() {
        $('#slider a').delay(4300).eq(index).fadeOut(function () {
            if (index === count) {
                index = -1;
            }

            $('#slider a').eq(index + 1).fadeIn(function () {
                index++;
                bannerRotator();
            });
        });
    }
    bannerRotator();

});