This is a simple code that allows easy and efficient image transitions.

JQuery Image Transition Code

<script type="text/javascript">
    // Render on page load
    $(document).ready(function() { 
        $(function(){
            // img_container is the class that holds all the images. See after script tags.
            $('.img_container img:gt(0)').hide();
            setInterval(function(){
            $('.img_container :first-child').fadeOut()
            .next('img').fadeIn()
            .end().appendTo('.img_container');}, 
            8000);
        });
    });
   
</script>

<div class="img_container">
                <img src="images/img1.png">
                <img src="images/img2.png">
                <img src="images/img3.png">
                <img src="images/img4.png">
                <img src="images/img5.png">
            </div>