Aide technique

FAQ (questions fréquentes)

Compte         Renouvellements         Les points         Général     Noms de domaine         Tarifs         Installer un domaine         DNS         Sous-domaines         Renouvellement         E-Mail         Général     Statistiques         Général     Technique         FTP         MySQL         Web         Général         PHP     E-Mail         Général     Services supplémentaires         Installer un service         Général         Espace Disque         E-Mail         Base MySQL Supplémentaire         Sauvegardes MySQL         Logs bruts         Sauvegarde sur CD         Trafic         Requêtes

FAQ (questions fréquentes) classée par categorie

Les Dossiers - Création de sites

Dreamweaver     Gif Movie Gear     Javascript     Booster votre trafic     Réussir son site     Créer son favicon     Le transfert par FTP     La source d'une page     Redirection     Optimisez vos images     Le fichier Robots.txt     Les meta-tags     Les couleurs par nom     Les 216 couleurs     Les 253 extensions     Les 283 symboles     Les CHMOD     Installer Apache     Installer Php

Les Dossiers - Le droit & internet

Création d'un site     Disparition d'un site     Marque et nom de domaine.     Droit d'auteur     Oeuvres protégées     Musique     Images     Textes     Logiciels, bases de données

Gagner de l'argent avec son site - Les regies

Plate-forme d'affiliation     Régies à l'affichages     Modules Carte Bleue     Marque blanche     Régies spécialisées     Régies au clic     Régies pro     Mailing list     Régies à l'appel     Services audiotel

Les générateurs

Générer vos meta tags     Générer vos popups     Générateur de CSS     Générateur de barre     Générateur de Couleur     Générateur de texte 3D     Générateur .htaccess     Générateur de menu     Générateur de roll-over     Générateur redirection     Générateur heure statut     Bannières aléatoires     Générateur de popup2     Générateur de barre2     Générateur de texte     Générateurs de lien

Aide graphique

Kits graphique de sites     Les bannières     Les vignettes

imode

Comment ça marche ?     Comment créer un site imode sur Jexiste ?     Les émulateurs

Cours sur le JavaScript.

Neige

Nous allons voir ici comment donner un effet de pluie tombante sur une page
Commencez par créer une image de 45x45 pixels, si possible en fond transparent, mais rien ne vous empêche d'utiliser ou de créer une image plus petite ou simplement plus grande.

Vous devez ensuite placer cette image dans le même dossier que la page qui affichera cette pluie.
Nommez-la 4.gif ou remplacez simplement le nom actuel (4.gif) par le nom de l'image que vous aurez créée.

Copiez ensuite le code ci-dessous, et collez-le dans votre page.

<script language="JavaScript1.2"> <!-- Script écrit par Altan. Visitez son site! --> <!-- http://www.altan.hr/snow --> <!-- Script utiliser à titre d'exemple --> <!-- http://www.jexiste.fr --> <!-- Begin var no = 15; // nombre de flocon var speed = 9; // Vitesse ou tombe les flocons var snowflake = "4.gif"; // Nom de votre image var ns4up = (document.layers) ? 1 : 0; // Version de netscape var ie4up = (document.all) ? 1 : 0; // Version d' Internet Exploreur var dx, xp, yp; // Coordonnées de positionnement var am, stx, sty; // amplitude and step variables var i, doc_width = 800, doc_height = 600; if (ns4up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx = new Array(); xp = new Array(); yp = new Array(); am = new Array(); stx = new Array(); sty = new Array(); for (i = 0; i < no; ++ i) { dx[i] = 0; // définition du coordonné xp[i] = Math.random()*(doc_width-50); // définition de la position yp[i] = Math.random()*doc_height; am[i] = Math.random()*20; // définition de l'amplitude stx[i] = 0.02 + Math.random()/10; // set step variables sty[i] = 0.7 + Math.random(); // set step variables if (ns4up) { // set layers if (i == 0) { document.write("<layer name=\"dot"+ i +"\" left=\"15\" "); document.write("top=\"15\" visibility=\"show\"><img src=\""); document.write(snowflake + "\" border=\"0\"></layer>"); } else { document.write("<layer name=\"dot"+ i +"\" left=\"15\" "); document.write("top=\"15\" visibility=\"show\"><img src=\""); document.write(snowflake + "\" border=\"0\"></layer>"); } } else if (ie4up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\""); document.write(snowflake + "\" border=\"0\"></div>"); } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\""); document.write(snowflake + "\" border=\"0\"></div>"); } } } function snowNS() { // définition de l'animation pour Netscape for (i = 0; i < no; ++ i) { // de même pour chaque point yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = self.innerWidth; doc_height = self.innerHeight; } dx[i] += stx[i]; document.layers["dot"+i].top = yp[i]; document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("snowNS()", speed); } function snowIE() { // Définition de l'animation pour Internet Exploreur for (i = 0; i < no; ++ i) { // de même pour chaque point yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx[i] += stx[i]; document.all["dot"+i].style.pixelTop = yp[i]; document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("snowIE()", speed); } if (ns4up) { snowNS(); } else if (ie4up) { snowIE(); } // End --> </script>

Vous disposez maintenant d'une pluie de l'image que vous avez créée sur votre page.

 - Cliquez ici pour avoir un aperçu

Un texte qui suit le mouvement de la souris

Nous allons voir ici comment réaliser un texte qui suit le mouvement de la souris.
Cet effet semble impressionnant, il est en fait très simple à mettre en place et à utiliser.
Cette version, contrairement à d'autres, vous permettra non seulement d'utiliser la police de votre choix mais aussi d'utiliser le gras et l'Italique, de choisir la taille de la police à afficher pour le suivi du curseur.

Le script se découpe en 3 parties.

Partie 1 : à mettre après la balise </HEAD>

<style> .spanstyle { position:absolute; visibility:visible; top:-50px; font-size:10pt; font-family:Arial, Helvetica, sans-serif; font-weight:bold; color:black; } </style> <script> /* Ce script à été écrit par Peter Gehrig (http://www.24fun.com/) <!-- Script utiliser à titre d'exemple --> <!-- http://www.espace-webmaster.com --> */ var x,y var step=20 var flag=0 // Entré juste en dessous( var ) la phrase de votre choix qui suivra la souris !!! var message="espace-webmaster " message=message.split("") var xpos=new Array() for (i=0;i<=message.length-1;i++) { xpos[i]=-50 } var ypos=new Array() for (i=0;i<=message.length-1;i++) { ypos[i]=-50 } function handlerMM(e){ x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY flag=1 } function makesnake() { if (flag==1 && document.all) { for (i=message.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+step ypos[i]=ypos[i-1] } xpos[0]=x+step ypos[0]=y for (i=0; i<message.length-1; i++) { var thisspan = eval("span"+(i)+".style") thisspan.posLeft=xpos[i] thisspan.posTop=ypos[i] } } else if (flag==1 && document.layers) { for (i=message.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+step ypos[i]=ypos[i-1] } xpos[0]=x+step ypos[0]=y for (i=0; i<message.length-1; i++) { var thisspan = eval("document.span"+i) thisspan.left=xpos[i] thisspan.top=ypos[i] } } var timer=setTimeout("makesnake()",30) } </script>

Partie 2 : à mettre entre les balises <BODY> et </BODY>

<script> <!-- début du JavaScript - for (i=0;i<=message.length-1;i++) { document.write("<span id='span"+i+"' class='spanstyle'>") document.write(message[i]) document.write("</span>") } if (document.layers){ document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = handlerMM; // - Fin du JavaScript - --> </script>

Partie 3 : cette dernière ligne de code est à mettre JUSTE APRÈS le marqueur </BODY>

<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll">

Les actions OnMouse.

Pour commencer, nous allons simplement définir l'action OnMouse.

Sans entrer trop dans les détails, nous définirons l'action OnMouse comme étant une action produite au passage de la souris sur un lien texte ou encore une image.

Il faut savoir que les effets OnMouse sont classés suivant trois catégories d'actions.
- OnMouseOver
- OnMouseDown
- OnMouseOut

OnMouseOver OnMouseDown OnMouseOut Passez la souris dessus Cliquez dessus Passez et cliquez dessus

Il est aussi possible de reproduire ces actions sur des liens texte afin de jouer un son par exemple, au survol d'un lien ou simplement lors du clic sur le lien.
Mais il faut savoir que ce script, car il s'agit bien d'un script, fonctionne avec Internet Exploreur depuis la version 4 et idem pour Netscape. Pour Netscape, le plugin LiveAudio doit obligatoirement être installé sur la machine de vos visiteurs pour qu'ils puissent entendre le son.
N'oublions pas non plus que la taille du son doit être très petit.
Pour exemple, le son utilisé sur cette page a un poids de 5 ko.