Randomizing a jQuery slideshow

MultiformeIngegno

  • Posts: 1,337
Re: Randomizing a jQuery slideshow
« Reply #15, on October 1st, 2011, 01:54 AM »Last edited on October 1st, 2011, 02:12 AM by MultiformeIngegno
Quote from Nao on October 1st, 2011, 01:35 AM
You should be showing your pics in order after the first randomization. I noticed several pics being faded out only to show up again next...
Uhm.. but what should be the order if I don't know what the 1st random image will be?

This is the code (1st image is random, then the "normal" order):
Code: [Select]
<div id="slider">
                    <ul id="sliderContent">

<?php
$header 
= array(
   array(
'http://virgilio.lorenzoraffio.com/wp-content/themes/virgilio/images/header/aula_magna.jpg''CAPTION AULA MAGNA''right'),
   array(
'http://virgilio.lorenzoraffio.com/wp-content/themes/virgilio/images/header/portone.jpg''CAPTION PORTONE''bottom'),
   array(
'http://virgilio.lorenzoraffio.com/wp-content/themes/virgilio/images/labchimica.jpg''CAPTION LAB CHIMICA''top'),
   array(
'http://virgilio.lorenzoraffio.com/wp-content/themes/virgilio/images/header/aula_informatica.jpg''CAPTION INFORMATICA''bottom'),
   array(
'http://virgilio.lorenzoraffio.com/wp-content/themes/virgilio/images/header/atrio.jpg''CAPTION ATRIO''top'),
);

$rand rand(0count($header) - 1);
echo 
'<li class="sliderImage"><img src="'$header[$rand][0], '" width="'HEADER_IMAGE_WIDTH'" height="'HEADER_IMAGE_HEIGHT'" alt="" /><span class="'$header[$rand][2], '">'$header[$rand][1], '</span></li>'?>



                        <li class="sliderImage">
                            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/header/aula_magna.jpg" width="<?php echo HEADER_IMAGE_WIDTH?>" height="<?php echo HEADER_IMAGE_HEIGHT?>" alt="" />
                            <span class="right"><strong>L'aula magna</strong><br />CAPTION AULA MAGNA</span>
                        </li>
                        <li class="sliderImage">
                            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/header/portone.jpg" width="<?php echo HEADER_IMAGE_WIDTH?>" height="<?php echo HEADER_IMAGE_HEIGHT?>" alt="" />
                            <span class="bottom"><strong>Il portone</strong><br />CAPTION PORTONE</span>
                        </li>
                        <li class="sliderImage">
                            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/header/aula_informatica.jpg" width="<?php echo HEADER_IMAGE_WIDTH?>" height="<?php echo HEADER_IMAGE_HEIGHT?>" alt="" />
                            <span class="top"><strong>Laboratorio di Chimica</strong><br />CAPTION LAB CHIMICA</span>
                        </li>
                        <li class="sliderImage">
                            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/labfisica.jpg" width="<?php echo HEADER_IMAGE_WIDTH?>" height="<?php echo HEADER_IMAGE_HEIGHT?>" alt="" />
                            <span class="top"><strong>Laboratorio di Fisica</strong><br />CAPTION INFORMATICA</span>
                        </li>
                        <li class="sliderImage">
                            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/header/atrio.jpg" width="<?php echo HEADER_IMAGE_WIDTH?>" height="<?php echo HEADER_IMAGE_HEIGHT?>" alt="" />
                            <span class="top"><strong>Atrio</strong><br />CAPTION ATRIO</span>
                        </li>

                        <li class="sliderImage">
                        </li>
                    </ul>
                </div>

If the 1st (random) image is "Aula magna", the non-random list have still "Aula magna" as the 1st item.. So I'll have again the same slides one after the other..