Comment créer un script d'images aléatoires pour mon site ?

 

par 6lvr |

     
Comment créer un script d'images aléatoires pour mon site ?

Sur le site Internet que vous êtes en train de confectionner, vous aimeriez avoir un petit module dans lequel vous feriez apparaître une photo, qui changerait de manière aléatoire pour ne pas toujours avoir la même. Vous créez alors un répertoire dans lequel placer les photos concernées par l'affichage aléatoire, puis suivez la procédure suivante :

Étapes de réalisation

1.

Vous ajoutez un répertoire dédié à vos photos aléatoires sur le serveur hébergeant votre site. Vous lui intégrez vos photos. Ainsi, elles ont maintenant toutes une adresse URL pour être consultées et appelées.

2.

Entre les balises <HEAD> de votre script, vous allez devoir intégrer ces quelques lignes:

<SCRIPT LANGUAGE="JavaScript">
/*
SCRIPT EDITE SUR L'EDITEUR JAVASCRIPT
http://www.editeurjavascript.com
*/

var nbimage= 50;
var width;
var height;
var url;
var alte;
function banniere()
{
numimage= Math.round(Math.random()*(nbimage-1)+1);
if (numimage <= 10)
{
gotosite = "[site lié à votre photo 1]";
url = "[URL de votre photo 1]";
alte = "[nom de votre photo 1]";
}
if (numimage > 10 && numimage <= 20)
{
gotosite = "[site lié à votre photo 2]";
url = "[URL de votre photo 2]";
alte = "[nom de votre photo 2]";
}
if (numimage > 20)
{
gotosite = "[site lié à votre photo 2]";
url = "[URL de votre photo 2]";
alte = "[nom de votre photo 3]";
{
document.write ('<A HREF="' + gotosite + '">');
}
document.write('<IMG SRC="' + url + '" ALT="' + alte + '" BORDER=0>')
if(gotosite != "")
{
document.write('</A>')
}
}
</SCRIPT>

3.

Cette partie est un peu complexe à adapter pour chaque site! Vous ne devez rien changer jusqu'au premier "gotosite".

Chaque photo est introduite par un "if (numimage...)" suivi d'une partie entre {}. Dans ces parties, vous remplacez :

1. "Site lié à votre photo" par l'adresse d'un lien que vous voudriez appliquer à la photo. C'est-à-dire qu'en fonction de la photo affichée, si vous cliquez dessus, vous serez redirigé vers une adresse Internet. Si vous ne voulez aucun lien, vous mettez : gotosite = "".

2. "URL de votre photo" par l'adresse URL de la photo hébergée (dans le dossier créé ci-dessus).

3. "Nom de votre photo" pour qu'il apparaisse si votre photo ne pouvait pas s'afficher.

4.

Vous pouvez ajouter autant de portions introduites par 1 "if (numimage...)" suivies d'une partie entre {} que vous le souhaitez.
Simplement, vous remarquerez que dans le "if (numimage...)", les données changent à chaque photo. Vous devez respecter la saisie de ces données, en les faisant augmenter selon le nombre de photos que vous intégrez au système aléatoire.

Pour 2 photos:
if (numimage <= 10), puis if (numimage > 10)

pour 3 photos:
if (numimage <= 10), puis if (numimage > 10 && numimage <= 20), puis if (numimage > 20)

pour 4 photos:
if (numimage <= 10), puis if (numimage > 10 && numimage <= 20), puis if (numimage > 20 && numimage <= 30), puis if (numimage > 30)

etc.

5.

Enfin entre les balises <BODY>, vous placez les lignes suivantes à l'emplacement où vous souhaitez afficher vos photos aléatoires :

<!-- DEBUT DU SCRIPT -->
<!--
SCRIPT EDITE SUR L'EDITEUR JAVASCRIPT
http://www.editeurjavascript.com
-->
<SCRIPT language="JavaScript">
banniere();
</SCRIPT>
<!-- FIN DU SCRIPT -->
<noscript><a href="http://www.editeurjavascript.com/countus/">compteur live</a></noscript>

Commentaires

altervista | 10/06/2015  

Au début, les pavés peuvent décourager, mais heureusement c'est bien construit et pas si pénible à suivre si on a suffisamment de volonté car c'est très facile à comprendre ! Malheureusement ton script ne fonctionne pas, il s'agit peut être d'une version obsolète :( Vous vous êtes aussi trompé au passage gotosite = "[site lié à votre photo 2]"; url = "[URL de votre photo 2]"; alte = "[nom de votre photo 3]";

infoalex | 21/10/2010  

eviter d'ecrire trop

Sur le même thème

alekhine

Comment recadrer une photo avec Paint ?

Des éléments peu esthétiques s'invitent souvent sur les photos : une voiture garée, un panneau publicitaire, une belle-mère... Le besoin de recadrer une photo se fait alors cruellement ressentir. Heureusement, c'est possible grâce à Paint, un progr

Somb'

Comment modifier une photo ?

Il existe de nombreux logiciels de retouche d'image permettant de modifier celles-ci à votre convenance, certains très simplistes et d'autres particulièrement sophistiqués. La référence en la matière reste le logiciel Adobe Photoshop, c'est donc en

murdarco

Comment mettre des photos sur Facebook ?

Vous avez créé votre profil sur Facebook et vous souhaitez mettre des photos sur Facebook. Vous avez plusieurs possibilités : celle tout d’abord de mettre une photo de profil qui apparaitra sur votre page d’accueil et vous identifiera auprès de vo

Chercher un article sur Comment fait-on