begin process at 2012 05 28 07:36:39
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Divers

 > AFFICHE IMAGES EN BACKGROUND

AFFICHE IMAGES EN BACKGROUND


 Information sur la source

Note :
Aucune note
Catégorie :Divers Niveau :Initié Date de création :22/11/2002 Date de mise à jour :22/11/2002 09:58:54 Vu :14 239
Auteur : Deny

Ecrire un message privé
Commentaire sur cette source (1)
Ajouter un commentaire et/ou une note

 Description

Par un formulaire en Select, permet d'afficher des images en background.
Un click droit sur la page ensuite permet de sélectionner l'image comme arrière-plan.
Pour nitro120 qui m'a demandé ça sur le script backgroundColor.
ATTENTION : Les images sont prévues pour être en 1024/768

Source

  • <html>
  • <head>
  • <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
  • <META NAME="GENERATOR" CONTENT="UltraEdit-32">
  • <META NAME="date" CONTENT="2002-06-19">
  • <META NAME="Author" CONTENT="Thierry Denele">
  • <head>
  • <script type="text/JavaScript">
  • var compteur = 3;
  • function selectplus() {
  • compteur = document.forms[0].elements[0].selectedIndex;
  • if (compteur < document.forms[0].elements[0].length-1) {compteur ++;}
  • document.forms[0].elements[0].selectedIndex=compteur;
  • }
  • function selectmoins() {
  • compteur = document.forms[0].elements[0].selectedIndex;
  • if (compteur > 0) {compteur --;}
  • document.forms[0].elements[0].selectedIndex=compteur;
  • }
  • function Go() {
  • compteur = document.forms[0].elements[0].selectedIndex;
  • document.body.style.backgroundImage = "url("+ imgname[compteur] +")";
  • }
  • function Selec(compteur) {
  • document.forms[0].elements[0].selectedIndex = compteur;
  • }
  • var imgname=new Array();
  • imgname[0]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_nebuleuseducone.jpg";
  • imgname[1]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_trapezedorion.jpg";
  • imgname[2]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_ugc10214.jpg";
  • imgname[3]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_ngc6782.jpg";
  • imgname[4]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_papillon.jpg";
  • imgname[5]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_tournesol.jpg";
  • </script>
  • </head>
  • <body>
  • <p style="color:black;font-weight:700;background-color:white;border:3 orange groove;width:100px;font-size:18px">Selectionnez l'image</p>
  • <form name="bgimage">
  • <p>
  • <select name="choix" size="1" value="images" style="background-color:antiquewhite;color: black; width: 200" onChange="javascript:Selec(this.selectedIndex)">
  • <option>Nébuleuse du cone
  • <option>Trapéze d'orion
  • <option>Galaxie UGC10214
  • <option selected>NGC6782
  • <option>Nébuleuse papillon
  • <option>Galaxie Tournesol
  • </select>
  • <input type="button" value="Go !" onClick="Go();">
  • </p>
  • <p>
  • <input type="button" style="width:80" value="Select down" onClick="selectplus()"><br><input type="button" style="width:80" value="Select up" onClick="selectmoins()">
  • </p>
  • </form>
  • </body>
  • </html> 
<html>
<head> 
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> 
<META NAME="GENERATOR" CONTENT="UltraEdit-32">
<META NAME="date" CONTENT="2002-06-19">
<META NAME="Author" CONTENT="Thierry Denele">
<head>
<script type="text/JavaScript"> 
var compteur = 3;
function selectplus() {
compteur = document.forms[0].elements[0].selectedIndex;
	if (compteur < document.forms[0].elements[0].length-1) {compteur ++;} 
document.forms[0].elements[0].selectedIndex=compteur;
}
function selectmoins() {
compteur = document.forms[0].elements[0].selectedIndex;
	if (compteur > 0) {compteur --;} 
document.forms[0].elements[0].selectedIndex=compteur;
}
function Go() {
	compteur = document.forms[0].elements[0].selectedIndex;
	document.body.style.backgroundImage = "url("+  imgname[compteur] +")";
	}
function Selec(compteur) {
document.forms[0].elements[0].selectedIndex = compteur;
}
var imgname=new Array(); 
imgname[0]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_nebuleuseducone.jpg"; 
imgname[1]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_trapezedorion.jpg"; 
imgname[2]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_ugc10214.jpg"; 
imgname[3]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_ngc6782.jpg"; 
imgname[4]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_papillon.jpg"; 
imgname[5]="http://perso.wanadoo.fr/astroweb2000/fondecran/img/photo_tournesol.jpg"; 

</script>
</head>
<body>
<p style="color:black;font-weight:700;background-color:white;border:3 orange groove;width:100px;font-size:18px">Selectionnez l'image</p>
<form name="bgimage">
<p>
<select name="choix" size="1" value="images" style="background-color:antiquewhite;color: black; width: 200" onChange="javascript:Selec(this.selectedIndex)">
<option>Nébuleuse du cone
<option>Trapéze d'orion
<option>Galaxie UGC10214
<option selected>NGC6782
<option>Nébuleuse papillon
<option>Galaxie Tournesol
</select>
<input type="button" value="Go !" onClick="Go();">
</p>
<p>
<input type="button"  style="width:80"  value="Select down" onClick="selectplus()"><br><input type="button"  style="width:80" value="Select up" onClick="selectmoins()">
</p>
</form>
</body>
</html>

 Conclusion

Merci à Astroweb2000 à qui j'ai piqué les références des images, sans lui demander son avis d'ailleurs, j'espère qu ça lui fera des visites.
&lt;http://perso.wanadoo.fr/astroweb2000/ index.html&gt;
Niveau1 / Niveau2 ? Tout est relatif !


 Sources du même auteur

DHTML - MANIP CSS
OUVERTURE POPUP À URL ALÉATOIRE
Source avec Zip 96 SITES RÉPERTORIÉS : HTML, CSS, DHTML, JAVA, JAVASCRIPT, P...
BROWSER SNIFFER (RENIFLEUR)
Source avec Zip DHTML SCROLLTOP
Toutes les sources de Deny

 Sources de la même categorie

Source avec Zip Source avec une capture SLIDESHOW IMAGES ET TEXTES EN PUR JAVASCRIPT par ansuzpeorth
Source avec Zip INPUT TEXT AUTOMATIQUE CREATION SUPPRESSION par lycanges
Source avec Zip Source avec une capture TABLE_SV : TABLEAU DYNAMIQUE, MONTRER/CACHER COLONNE SUR DEM... par synanceia
COLONNES ADAPTABLES EN HAUTEUR par dronoide
Source avec Zip VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol
Toutes les sources de la catégorie Divers

Commentaires et avis

Commentaire de marshall85 le 08/08/2010 15:36:53

Ehhh! je sait pas si c'est moi mais il ce passe rien lorsque on clique sur GO!, Ni sur FF ni SUR IE, emmm bisard ?!! ;)

 Ajouter un commentaire

Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,484 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)