Comment afficher aléatoirement des images en provenance de myalbum dans un bloc avec un effet de fondu ?

Remplacez XOOPS_UPLOAD_PATH.'/thumbs/ avec l'emplacement de vos vignettes

$header = <<<fintexte
<style type="text/css">
#imageSlideshowHolder{
margin:14px; /* "Air" */
width:141px; /* Image width */
height:113px; /* Image height */
position:relative; /* Don't remove this line */
}

/* Don't change these values */
#imageSlideshowHolder img{
position:absolute;
left:0px;
top:0px;
}
</style>
<script type="text/javascript">
/************************************************************************************************************
(C) www.dhtmlgoodies.com, November 2005

This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.

Terms of use:
You are free to use this script as long as the copyright message is kept intact. However, you may not
redistribute, sell or repost it without our permission.

Thank you!

www.dhtmlgoodies.com
Alf Magne Kalleland

************************************************************************************************************/

var slideshow2_noFading = false;
var slideshow2_timeBetweenSlides = 1000; // Amount of time between each image(1000 = 1 second)
var slideshow2_fadingSpeed = 10; // Speed of fading (Lower value = faster)

var slideshow2_galleryContainer; // Reference to the gallery div
var slideshow2_galleryWidth; // Width of gallery
var slideshow2_galleryHeight; // Height of galery
var slideshow2_slideIndex = -1; // Index of current image shown
var slideshow2_slideIndexNext = false; // Index of next image shown
var slideshow2_imageDivs = new Array(); // Array of image divs(Created dynamically)
var slideshow2_currentOpacity = 100; // Initial opacity
var slideshow2_imagesInGallery = false; // Number of images in gallery
var Opera = navigator.userAgent.indexOf('Opera')>=0?true:false;
function createParentDivs(imageIndex)
{
if(imageIndex==slideshow2_imagesInGallery){
showGallery();
}else{
var imgObj = document.getElementById('galleryImage' + imageIndex);
if(Opera)imgObj.style.position = 'static';
slideshow2_imageDivs[slideshow2_imageDivs.length] = imgObj;
imgObj.style.visibility = 'hidden';
imageIndex++;
createParentDivs(imageIndex);
}
}

function showGallery()
{
if(slideshow2_slideIndex==-1)slideshow2_slideIndex=0; else slideshow2_slideIndex++; // Index of next image to show
if(slideshow2_slideIndex==slideshow2_imageDivs.length)slideshow2_slideIndex=0;
slideshow2_slideIndexNext = slideshow2_slideIndex+1; // Index of the next next image
if(slideshow2_slideIndexNext==slideshow2_imageDivs.length)slideshow2_slideIndexNext = 0;

slideshow2_currentOpacity=100; // Reset current opacity

// Displaying image divs
slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'visible';
if(Opera)slideshow2_imageDivs[slideshow2_slideIndex].style.display = 'inline';
if(navigator.userAgent.indexOf('Opera')<0){
slideshow2_imageDivs[slideshow2_slideIndexNext].style.visibility = 'visible';
}

if(document.all){ // IE rules
slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity=100)';
slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity=1)';
}else{
slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = 0.99; // Can't use 1 and 0 because of screen flickering in FF
slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = 0.01;
}


setTimeout('revealImage()',slideshow2_timeBetweenSlides);
}

function revealImage()
{
if(slideshow2_noFading){
slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
if(Opera)slideshow2_imageDivs[slideshow2_slideIndex].style.display = 'none';
showGallery();
return;
}
slideshow2_currentOpacity--;
if(document.all){
slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity='+slideshow2_currentOpacity+')';
slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity='+(100-slideshow2_currentOpacity)+')';
}else{
slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = Math.max(0.01,slideshow2_currentOpacity/100); // Can't use 1 and 0 because of screen flickering in FF
slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = Math.min(0.99,(1 - (slideshow2_currentOpacity/100)));
}
if(slideshow2_currentOpacity>0){
setTimeout('revealImage()',slideshow2_fadingSpeed);
}else{
slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
if(Opera)slideshow2_imageDivs[slideshow2_slideIndex].style.display = 'none';
showGallery();
}
}

function initImageGallery()
{
slideshow2_galleryContainer = document.getElementById('imageSlideshowHolder');
slideshow2_galleryWidth = slideshow2_galleryContainer.clientWidth;
slideshow2_galleryHeight = slideshow2_galleryContainer.clientHeight;
galleryImgArray = slideshow2_galleryContainer.getElementsByTagName('IMG');
for(var no=0;no<galleryImgArray.length;no++){
galleryImgArray[no].id = 'galleryImage' + no;
}
slideshow2_imagesInGallery = galleryImgArray.length;
createParentDivs(0);

}

</script>
fintexte;

echo $header;

$images = array();
$images = glob(XOOPS_UPLOAD_PATH.'/thumbs/*.*');
srand((double) microtime() * 10000000);
$tbluneimage = array();
$tbluneimage = array_rand($images, 21);
$lesimages = array();
foreach($tbluneimage as $uneimage) {
$lesimages[] = XOOPS_UPLOAD_URL.'/thumbs/'.basename($images[$uneimage]);
}

$header2 = <<<fintexte
<div id="imageSlideshowHolder">
<img src="$lesimages[0]">
<img src="$lesimages[1]">
<img src="$lesimages[2]">
<img src="$lesimages[3]">
<img src="$lesimages[4]">
<img src="$lesimages[5]">
<img src="$lesimages[6]">
<img src="$lesimages[7]">
<img src="$lesimages[8]">
<img src="$lesimages[9]">
<img src="$lesimages[10]">
<img src="$lesimages[11]">
<img src="$lesimages[12]">
<img src="$lesimages[13]">
<img src="$lesimages[14]">
<img src="$lesimages[15]">
<img src="$lesimages[16]">
<img src="$lesimages[17]">
<img src="$lesimages[18]">
<img src="$lesimages[19]">
<img src="$lesimages[20]">
</div>
<script type="text/javascript">
initImageGallery(); // Initialize the gallery
</script>
fintexte;
echo $header2;