Leçon de script 4

Une table avec des feuilles qui tombes

Pour voir le résultat cliquez ici

Nous allons travailler avec ce courrier en format eml .
Téléchargez-le Ici

Première étape

1-Faite vous un dossier dans votre disque dur pour y mettre tout ce qui va se rapporter à ce script .

2-Ensuite nous allons récupéré les choses qui ont servi à faire le script dans le email que vous avez télécharger et les enregistrer dans votre dossier . Les explications sont ici

3-Maintenant allons voir ce que vous avez enregistrer et je vous conseille au tout début de prendre des images et tuiles de la même dimension que ceux que vous avez récupérer si vous êtes débutant. Pour voir la dimension de vos images survolez votre souris sur l'image et un carré va apparaître avec les informations .

Comme vous pouvez le constater vous allez avoir besoin de vous faire 2 tuiles de 300 x 300 et une image dans un cadre de 494 de large par 496 de hauteur , un gif et un midi pour faire ce script .

Après avoir faite vos tuiles et votre cadre et choisi votre musique on va y aller pour la suite .

----------------------------------------------------

Deuxième Étape

*Pour les les personne qui ont le pack 2 et qui ne sont pas capable d'ouvrir le bloc- note avec la touche CTRL-F2 voici le eml déjà enregistrer en format html à télécharger ICI
Vous pouvez poursuivre à la troisième étape du tutoriel.

1- Vous aller ouvrir le eml fourni si ce n'est pas déjà faite et appuyez sur les touches CTRL+F2.

2- Le bloc note va s'ouvrir .

3 - Vous allez faire Fichier /Enregistrer sous et enregistrer le script en format html dans votre dossier comme sur ma capture .

Vis à vis Nom du fichier tapez .html

4-Fermer le messages en Eml et le Bloc note pour ne pas vous mêler à la prochaine étape

-------------------------------------

Troisième Étape

Maintenant on a tous ce qu'il nous faut pour faire les modifications.

1-Vous allez cliquer sur le fichier en html que l'on viens d'enregistrer dans votre dossier .

2-Internet Exploreur va s'ouvrir et vous aller voir un fond rouge avec des x qui tombent .

3-Vous allez dans Affichage/ Source et le Bloc- note va s'ouvrir .

4-Je vous copie ce que vous avez eu dans le Bloc note un peu plus bas et vous mets en rouge les endroits à modifier avec les explications en bleu .

Vous allez coller le chemin des images que vous avez faite . Les explications sont ici si vous ne savez pas le faire .

5-Vous aller faire les modifications une par une comme je vous l'indique dans le script et après chaque modification on va regarder ce que ça donne pour voir si tout est correcte .

6--Voici comment vous allez procéder tout au long des modifications.

Dans le bloc note vous allez coller le premier chemin d'accès et ensuite faire Fichier/ enregistrer .

Ensuite retournez dans Internet Explorer sur le fichier html rouge avec les x rouge et faire Affichage /Actualiser. ou bien utiliser cette icône

Ok on y va toute les étapes sont indiquées en bleu .

Vous pouvez télécharger le script et ses explications en format Word pour imprimer ici si vous le désirer

On débute les modifications dans le bloc note

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">

Ici c'est la couleur de la scrollbar .et de l'arrow (c'est le petit pointu sur la scrollbar)

Mettez une couleur en accord avec vous tuile et votre image.

Faite -le en dernier car c'est moins difficile de trouver la couleur qui va le mieux .

Effacez ce qui est en rouge et vous collez votre chiffre .

Après avoir coller vos codes faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur et faire Affichage /Actualiser et vous allez voir le résultat.

On retourner dans le bloc note pour la suite

<STYLE>BODY {
MARGIN-TOP: 10px; FONT-SIZE: 18pt; MARGIN-LEFT: 0px; COLOR: #d95956; MARGIN-RIGHT: 10px; SCROLLBAR-ARROW-COLOR: #d5c0af; FONT-FAMILY: monotype corsiva; SCROLLBAR-BASE-COLOR: #d95956; BACKGROUND-COLOR: #d95956
}
</STYLE>

<META content="MSHTML 6.00.2800.1498" name=GENERATOR></HEAD>

Ici c'est arrière plan ,

Effacer ce qui est en rouge et vous collez le chemin de votre tuile la plus foncé et ajoutez des guillemets au début et à la fin de votre chemin car sinon ça ne fonctionnera pas .

ex:"C:\script\lecon2\image6.jpg"

Après avoir coller le chemin de la tuile faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur sur votre fond rouge avec des x rouge et faire Affichage /Actualiser et vous aller voir votre arrière plan .

On retourner dans le bloc note pour la suite

Ici c'est le midi ,

Effacer ce qui est en rouge et vous collez le chemin de votre midi .

Après avoir coller le chemin de votre midi faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur et faire Affichage /Actualiser et vous aller entendre votre midi.

On retourner dans le bloc note pour la suite

Ici c'est la couleur des bordure de la table .

Mettez une couleur en accord avec vous tuile et votre image.

Faite -le en dernier car c'est moins difficile de trouver la couleur qui va le mieux .

Effacer ce qui est en rouge et vous collez vos chiffres .

Après avoir coller vos chiffres faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur et faire Affichage /Actualiser et vous allez voir le résultat.

On retourner dans le bloc note pour la suite

Ici c'est l'image ,

Effacez ce qui est en rouge et vous collez le chemin de votre image .

*Si vous avez faite une image d'une autre dimension changer les chiffres que j'ai mis en rouge width est la largeur et height est la hauteur.

Après avoir coller le chemin de l'image faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Ensuite retournez dans votre Internet Exploreur et faire Affichage /Actualiser et vous aller voir votre image .

On retourner dans le bloc note pour la suite

<IMG
height=494 src="cid:009a01c550ac$c19a7790$6400a8c0@chezlylee" width=496
border=0>
<TABLE cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD width="50%">
<P align=center><STRONG><FONT size=4></FONT></STRONG> </P>
<P align=center><STRONG><FONT size=5>Écrire ici
</FONT></STRONG></P></TD></TR></TBODY></TABLE></DIV>

Ici c'est votre deuxième tuile,

Effacer ce qui est en rouge et vous collez le chemin de votre tuile la plus pâle .

Après avoir coller le chemin de la tuile faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur et faire Affichage /Actualiser et vous aller voir votre tuile .

On retourner dans le bloc note pour la suite

<IMG
id=image style="DISPLAY: none" height=600
src="cid:009b01c550ac$c19ce890$6400a8c0@chezlylee" width=800>
<SCRIPT language=JavaScript>
function tableBackground()
{
TabBak.background = image.src;
}

tableBackground();
</SCRIPT>

<DIV></DIV>

Ici c'est votre gif,

Effacer ce qui est en rouge et vous collez le chemin de votre gif .

Après avoir coller le chemin du gif faire Fichier /Enregistrer et réduisez le bloc note dans la barre de tâche pour le reprendre plus tard

Allez dans votre Internet Exploreur et faire Affichage /Actualiser et vous aller voir votre gif tombé .

On retourner dans le bloc note pour la suite

<IMG
id=snowtemp style="DISPLAY: none"
src="cid:009c01c550ac$c19ce890$6400a8c0@chezlylee">
<SCRIPT language=JavaScript1.2>

var no = 16; // snow number
var speed = 10; // smaller number moves the snow faster

var snowflake = snowtemp.src;

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 = 500;
}
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 = 500;
}
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>

<P align=left>
<SCRIPT language=JavaScript>
ScrollSpeed = 600; // milliseconds between scrolls
ScrollChars = 4; // chars scrolled per time period

function SetupTicker() {
// add space to the left of the message
msg = " ~~Bonne journée Visitez mon site http://chezlylee.site.voila.fr~~ ";
RunTicker();}

function RunTicker() {
window.setTimeout('RunTicker()',ScrollSpeed);
window.status = msg;
msg = msg.substring(ScrollChars) + msg.substring(0,ScrollChars);}
SetupTicker();

</SCRIPT>
</P></TD></TR></TBODY></TABLE></CENTER></DIV></BODY></HTML>

Quand vous avez fini de modifier tous les endroits indiquées et que vous êtes satisfaits on passe à la quatrième étape.

----------------------------------------------------

Quatrième étape

Voilà la dernière étape qui consiste à faire un message Outlook avec ce que vous venez de faire .

1- Vous allez retourner sur le bloc note et faire Édition /Sélectionner tout

2- Faire /Édition /Copier

3- Ouvrir un nouveau message dans Outlook

4-Allez sur 'onglet Source et effacer tout ce que vous voyez .

5-Placer votre curseur dans la fenêtre d'écriture et avec le bouton droit de la souris dans le menu déroulant choisir coller .Ce que vous avez sélectionner dans le Bloc- note va apparaître

6-Pour voir si le script est correcte allez sur l'onglet Aperçu. . Retourner sur l'onglet modifier pour écrire le texte .

Voilà la quatrième leçon est terminée

On passe à la suivante .

Lylee

Menu Principal
Apprivoisez Outlook
Petits Scripts divers