I needed a slideshow that would load (in a way, asynchronously) after the page has been loaded and would show something without JavaScript.
This solution requires jQuery and jQuery Cycle plugin (lite version will do).
<div id="slideshow"> <img src="default-image.jpg" alt="" /><!--defaults to this image without javascript --> </div> <script type="text/javascript"> $(document).ready(function() { //// random slides var SLIDE_COUNT = 12; var r = Math.floor(Math.random()*SLIDE_COUNT+1); var i = 1; $('#slideshow').empty(); // clears the slideshow contents (default image) for (i = 1; i <= SLIDE_COUNT; i++) { $('#slideshow').append('<img src="slide-' + r + '.jpg" alt="" />'); r = (r % SLIDE_COUNT) + 1; } //// fixed slides //$('#slideshow').append('<img src="slide-1.jpg" alt="" />'); //$('#slideshow').append('<img src="slide-2.jpg" alt="" />'); $('#slideshow').cycle(); }); </script>