Lissa Vous Explique Tout: java

Java

Comment faire neiger sur ma page ? Comment créer un curseur avec traînée de texte ?

Comment faire neiger sur ma page ? Vous pouvez faire un effet de chute de neige (ou de toute autre image comme des feuilles ou des coeurs) sur l'�cran en ajoutant le code suivant juste apr�s la balise de votre page (ce script est fourni avec la permission de son auteur) :

<script language="JavaScript1.2">

<!-- Begin
var no = 15; // snow number
var speed = 9; // smaller number moves the snow faster
var snowflake = "bheart4.gif";

var ns4up = (document.layers) ? 1 : 0;  // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var dx, xp, yp;    // coordinate and position variables
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;                        // set coordinate variables
xp[i] = Math.random()*(doc_width-50);  // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20;         // set amplitude variables
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() {  // Netscape main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
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() {  // IE main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
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>

Il est nécessaire aussi de télécharger ce flocon de neige et de le transférer sur votre serveur :

Vous pouvez utiliser des coeurs, des étoiles, des flocons de neige, des feuilles ou tout ce que vous voulez. J'ai sur ma page quelques images (user name="abc" password="123) que vous pouvez utiliser, si c'est le cas faites un lien vers ma page =) Si vous utilisez une image autre que le flocon de neige, vous devez remplacer le nom de l'image dans le code ci-dessous. C'est un peu difficile à trouver, mais il est situé à la 9ème ligne dans le code ci-dessous. Remplacez le mot "snow" par le nom de votre nouveau gif.

Comment créer un curseur avec traînée de texte ? Ce script VRAIMENT impressionnant, fait que tout mot, expression ou phrase se mettra à suivre votre curseur. Vous pouvez même choisir la police et la couleur que vous voulez. Ajoutez cette balise dans votre en-tête en précisant votre message et votre police (ce script est utilisé avec la permission écrite de l'auteur (Peter Gehrig--visitez sa page, il y a un tas de scripts superbes!!):

<style>
.spanstyle {
	position:absolute;
	visibility:visible;
	top:-50px;
	font-size:10pt;
	font-family:comic sans ms;
      font-weight:bold;
	color:black;
}
</style>
<script>

/*
This cool Cursor trailer text is authored by Peter Gehrig (http://www.24fun.com/)
This script is provided free at Lissa Explains it All (http://www.lissaexplains.com)

*/

var x,y
var step=20
var flag=0

// Your snappy message. Important: the space at the end of the sentence!!!
var message="Lissa Explains it All! "
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>

Vous devez ajouter ensuite ce marqueur dans la partie "body" de votre page :

Il faut ensuite placer ce marqueur JUSTE APRÈS le marqueur "body" :

C'est tout !

Merci André de m'avoir aidé pour la traduction !!!!!
Copyright ©1998-2000 LissaExplains.com, Inc. Tous droits réservés
Ce site Web est inscrit au Library of Congress COPYRIGHT OFFICE Limites et conditions d'utilisation Tous les autres copyright sont la propriété de leurs propriétaires respectifs.