Simple JQuery Slideshow that Refreshes Order of Pictures

Right now on my current website, I have it going through the pictures in the order of the array, but I would like it so whenever the user refreshes the website, the slideshow randomly shuffles the pictures in a different order.

Code:

---

<script type="text/javascript">
var imgs = [
'images/slideshow/001.jpg',
'images/slideshow/002.jpg',
'images/slideshow/003.jpg',
'images/slideshow/004.jpg',
'images/slideshow/005.jpg',
'images/slideshow/006.jpg'];
var cnt = imgs.length;

$(function() {
setInterval(Slider, 3000);
});

function Slider() {
$('#imageSlide').fadeOut("slow", function() {
// the source of the problem
$(this).attr('src', imgs[Math.floor (Math.random( ) * imgs.length) % cnt]).fadeIn("slow");
});

}
</script>

---

Any help is appreciated! =]

There are plenty examples out there on how to sort an array randomly. Search Google for "JavaScript array random sort."

Thank you for that tip!

I wanted to know if I could interchange JavaScript techniques with JQuery because I wanted to try and use these tips:
http://hungred.com/how-to/tutorial-s...ay-javascript/

It's 3 lines of code. Why waste the resources to interact with jQuery? Since jQuery doesn't have a random sorting method included, you'd have to extend the jQuery framework which would be more work.

Just to add to this here is a really basic slider I enjoy using. I like it cause the code is really easy to understand and it includes thumnails, next and previous buttons and a rotating description section too

http://codetutorial.caroshaw.com/jqu...age_slider.php

Welcome to the forums alicialou! :wave:

Please remember to keep your posts relevant. This thread is 3 years old!