Exercices...

Citation :: <html>
<head>
<title>BALISE SELECT javascript</title>

<script language="javascript">
// Ce sript permet de créer un formulaire <select> avec un choix de redirection (liens)
// une autre façon d'écrire le formulaire11.htm
//Ici un script va permettre de créer les valeurs qui seront dans la balise <select> au lieu d'écrire à chaque fois <option>...
sites=["http://www.wmteam.de","http://www.webook.org","http://www.yahoo.fr","http://www.google.fr"];
function ouvrir(lien){
window.open(lien);
}
</script>
</head>
<body topmargin="150">
<center>
<form>
<select onchange="ouvrir(this.value)">
<option>Sélectionner un site à ouvrir</option>
<script>
for(i=0;i<sites.length;i++){
tab=sites[i].split(".");
document.write("<option value=' "+sites[i]+" '>"+tab[tab.length-2]+"</option>");
}
</script>
</select>
</form>
</center>
</body>
</html>

Sélectionner un site à ouvrir

for(i=0;i

exemple d'utilisation de true , false et split

Citation :: <html>
<head>
<title>DATE </title>

<script language="javascript">
// On déclare une liste nomée : mots
mots=["javscript","printemps","alexandre","anticonstitutionellement","boudin creole","patrick l\'etoile de mer"]
function afficher(){
// Ecriture abrégé pour la génération d'un mot aléatoire dans la liste...choix sera ce mot.
choix=mots[Math.round(Math.random()*(mots.length-1))];
//on découpe le mot grâce à split = ici on découpe par lettre"
decoup=choix.split("");
// avec cette ligne on va inverser le sens des découpes donc ici des lettres
decoup=decoup.reverse();
document.forms[0].elements[0].value="";
for(i=0;i<decoup.length;i++){
// affichage dans input
document.forms[0].elements[0].value+=decoup[i];
}
}
function verif(){
if(document.forms[0].elements[1].value==choix){
if(confirm("GAGNE! Voulez vous jouez encore")){
// afficher : abrégé de function afficher (){............} ci dessus
afficher();
// vider le input
document.forms[0].elements[1].value="";
// redonne le focus à input
document.forms[0].elements[0].focus();
}
else{
self.close();
}
}
else{
// idem que ci dessus
document.forms[0].elements[1].value="";
document.forms[0].elements[1].focus();
}
}
</script>

</head>
<body topmargin="150" onload="afficher()">
<center>
<form>
<input type="text"/><br /><br />
<input type="text"/><br /><br />
<input type="button" value="verif" onclick="verif()"/><br /><br />
</form>
</center>
</body>
</html>

Utilisation de split

Créer un liste select avec uniquement le nom du site

Citation :: <html>
<head>
<title>BASE formulaire</title>

<script language="javascript">
// ce script va nous permettre de créer un formulaire select redirigeant vers plusieurs liens
// Cette fonction est appelé par <select onchange="ouvrir(this.value)"> , this.value correspondant au lien choisi sera plaçé à la place de lien, on aura par ex: window.open("http://www.google.com")
function ouvrir(lien){
// window.open(lien) : pour ouvrir le lien dans une nouvelle fenêtre, à la place de lien on aura la valeur du lien renvoyé depuis la balise option.
window.open(lien);
}
</script>
</head>

<body topmargin="100">
<center>


<form>
<select onchange="ouvrir(this.value)">
<option value="htpp://www.google.com">Google</option>
<option value="htpp://www.yahoo.com">Yahoo</option>
<option value="htpp://www.malimalo.com">Malimalo</option>
</select>
</form>
</center>
</body>
</html>

ecrire la date + utilsation de concatenation

Citation :: <html>
<head>
<title>DATE </title>
<script language="javascript">

// On déclare la création d'une nouvelle liste de Date dt est le nom que l'on a crée pour cette liste.
jr=["Dimanche","Lundi","Mardi","Mercredi","jeudi","Vendredi","Samedi"];
dat=[""];
ms=["Janvier","Fevrier","mars","Avril","Mai","Juin","Juillet","Août","Septmbre","Octobre","Novembre","Décembre"];
ann=[""];
dt=new Date();
jour=dt.getDay();//Jour : getDay
datt=dt.getDate();//Date : getDate
mois=dt.getMonth();//Mois : getMonth
an=dt.getYear();//Année : getYear
document.write("nous sommes le "+jr[jour]+" "+datt+" "+ms[mois]+" "+an);

</script>
</head>
<body topmargin="150">

</body>
</html>

Citation :: Créer un bouton multiliens.... avec utilisation de setTimeout afficher un lien toutes les 2 secondes (2000 millièmes)

Citation :: <html>
<head>
<title></title>
<script language="javascript">
sites=["http://www.wmteam.de","http://www.webook.org","http://www.yahoo.fr","http://www.google.fr"];
i=0;
function afficher(){
document.forms[0].elements[0].value=sites[i];
if(i<sites.length-1){
i++;
}
else{
i=0;
}
setTimeout("afficher()",2000);
}
</script>
</head>
<body topmargin="150" onload="afficher()">
<center>
<form>
<input type="button" value="" onclick="window.open(this.value,'nn','width=400,height=400')">
</form>
</center>
</body>
</html>

des boutons radios ouvrant des liens dans des popups!

Citation :: <html>
<head>
<title></title>
</head>
<body topmargin="150">



<input type="radio" onclick="ff=window.open('http://www.webook.org','nom');ff.focus()">Webook<br /><br />
<input type="radio" onclick="ff=window.open('http://www.google.fr','nom');ff.focus()">Google<br /><br />
<input type="radio" onclick="ff=window.open('http://www.yahoo.fr','nom');ff.focus()">Yahoo<br /><br />
</body>
</html>

principe des mouvements d'une fenêtre

Citation :: <html>
<head>
<title> MOVE BY </title>
<script language="javascript">

window.resizeTo(800,400);
window.moveTo(100,200);
i=-100;
bouger=true;
function voyager(){
if(i>0 && bouger){
i--;
window.moveBy(i,0);
}
else{
bouger=false;
}
if(bouger==false && i<100){
i++
window.moveBy(i,0);
}
setTimeout("voyager()",1);
}
</script>
</head>
<body topmargin="150" onload="voyager()">
<center>

</center>
</body>
</html>

!!!!!!!!!!!!!!!!!!REPOST!!!!!!!!!!!!!!!!!!!!!!!

Ecrire d'un champs de texte à un textarea

Citation :: Citation:

<html>
<head>
<title>CHAMPS DE TEXTE</title>

<script language="javascript">
// variable vide attendant des strings
liste="";

// début de la fonction ecrire
function ecrire(){
with(document.forms[0]){
//j'ajoute à liste une nouvelle chaine venant du champ de texte
liste+=elements[0].value+"\n";
// j'écris liste dans le textarea, value correspondant à l'attribut de textarea
elements[2].value=liste;
}
}
</script>
</head>
<body topmargin="150">
<form>
<center>
<input type="text"><br /><br />


<input type="button" value="\/" onclick="ecrire()"><br /><br />
<textarea cols="20" rows="10"></textarea>
</center>
</form>
</body>
</html>

!!!!!!!!!!!!!!!!!!REPOST!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Le même principe cad d'écrire le texte contenu d'un champs de texte dans un textarea en puyant sur un bouton:

Cette fois ci le champs de texte retrouve le focus et l'on peut écrire le mot à la suite avec un retour chariot.

Citation :: Citation:

CHAMPS DE TEXTE AVEC FOCUS

//script identique à CHAMPS DE TEXTE mais avec l'effacement du champs texte et le retour du focus dessus.

liste="";
function ecrire(){
with(document.forms[0]){
liste+=elements[0].value+"n";
elements[2].value=liste;
elements[0].value=""; //je vide le champ de texte
elements[0].focus();// et je lui donne le focus
}
}

!!!!!!!!!!!!!!!!!!!!!REPOST!!!!!!!!!!!!!!!!!!!!!!!!!!
champs de texte+bouton radio+redirection

Citation :: <html>
<head>
<title>DATE </title>
<script language="javascript">
function lien(){
if(document.forms[0].elements[1].checked){
window.open(document.forms[0].elements[0].value)
}
}
</script>
</head>
<body topmargin="150">
<center>

<form>
<input type="text"><br />
<input type="radio" name="nom"><br />
<input type="button" value="aller à" onclick="lien()"><br />
</form>
</center>
</body>
</html>

Bon celui là on l'aura pas vendredi,
mais c'est interressant à connaitre je penses....

Utilisation des maps.....
Il faudra biensûr travailler une image avant dans dreamweaver pour créer des maps dans un fichier .htm, puis on ouvre ce fichier est on compléte le code:

Citation :: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>EUROPE</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">






<script language="javascript">
france=["France","550 000 km2","66 000 000","Jacques Chirac"];
italie=["Italie","420 000 km2","52 000 000","Romano Prodi"];
espagne=["Espagne","410 000 km2","48 000 000","Jose Luis Zapatero"];
angleterre=["Angleterre","380 000 km2","62 000 000","Tony Blair"];
portugal=["Portugal","180 000 km2","24 000 000","José Batavia"];
irlande=["Irlande","275 000 km2","33 000 000","Peter Alleway"];

// fonction appelée par le mouseover des maps, la boucle for va tourner de 0 à france.length cad 4. on aura donc elements[0] puis [1] etc...
// Ex : Comme il est inscrit fonction(espagne) dans les maps, elles renvoient à la liste et ses éléments...For appliquera pays[i] (par ex: 410 000 km2) à elements[i] cad les champs de texte,
function voir(pays){
for(i=0;i<france.length;i++){
document.forms[0].elements[i].value=pays[i];
}
}
</script>



</head>
<body bgcolor="#000099">
<form>
<table width="57%" border="0" align="center" bgcolor="#66CCFF">
<tr>
<td colspan="3" rowspan="4"><img src="Carte%20Europe.jpg" width="429" height="503" border="0" usemap="#Map"></td>
<td width="34%"><form name="form1" method="post" action="">
<p><font size="2" face="Arial, Helvetica, sans-serif"><b>- PAYS</b></font></p>
<p>
<input name="textfield" type="text" size="40" maxlength="70">
</p>
</td>
</tr>
<tr>
<td><p><font size="2" face="Arial, Helvetica, sans-serif"><b>- SUPERFICIE</b></font></p>
<p>
<input name="textfield2" type="text" size="40">
</p></td>
</tr>
<tr>
<td><p><font size="2" face="Arial, Helvetica, sans-serif"><b>- POPULATION</b></font></p>
<p>
<input name="textfield3" type="text" size="40">
</p></td>
</tr>
<tr>
<td><form name="form2" method="post" action="">
<p><font size="2" face="Arial, Helvetica, sans-serif"><b>- PRESIDENT</b></font></p>
<p>
<input name="textfield4" type="text" size="40">
</p>
</form></td>
</tr>
</table>
</form>




<map name="Map">
<area shape="poly" coords="124,274,124,283,115,284,107,279,98,280,96,289,103,292,111,301,112,312,116,320,117,327,
113,330,103,353,117,370,123,370,129,374,144,377,152,368,165,369,181,376,192,371,192,362,189,355,
193,343,190,331,184,335,192,323,203,314,209,300,207,295,186,281,174,267,166,262,156,270,143,276,
133,276,125,274,123,273,124,276" href="javascript:void(0)" onmouseover="voir(france)">
<area shape="poly" coords="203,315" href="javascript:void(0)" onmouseover="voir(Irlande)">
<area shape="poly" coords="202,314,188,329,193,331,194,339,201,340,208,339,215,344,218,338,225,340,231,332,223,328,224,321,217,322,215,316,203,315" href="javascript:void(0)" onmouseover="voir(Italie)">
<area shape="poly" coords="145,380,138,391,109,402,100,415,102,423,79,435,73,439,49,434,31,439,25,434,25,422,20,415,24,
408,23,399,28,391,31,383,35,386,41,369,48,367,42,357,34,355,26,350,29,341,27,332,37,331,42,327,53,337,59,336,78,346,101,353,114,367,125,371,143,381,143,381" href="javascript:void(0)" onmouseover="voir(espagne)">
<area shape="poly" coords="9,417,1,411,8,397,5,390,4,384,10,375,23,360,26,354,41,358,45,365,40,371,34,382,30,382,22,397,24,406,21,410,22,417,11,418" href="javascript:void(0)" onmouseover="voir(portugal)">
<area shape="poly" coords="95,251,106,243,117,245,
123,239,114,237,108,232,117,223,114,220,124,214,132,217,133,205,132,196,119,189,126,185,126,177,120,184,118,180,126,169,122,167,130,152,138,146,153,148,141,156,148,160,
154,165,144,178,138,181,145,186,149,200,153,211,155,233,163,233,159,248,149,250,157,255,146,261,134,
256,122,256,118,253,111,258,104,253,100,256,94,253" href="javascript:void(0)" onmouseover="voir(angleterre)">
<area shape="poly" coords="93,221,84,220,75,223,69,218,66,211,79,201,78,196,81,186,97,186,103,182,110,184,117,194,113,199,110,202,105,214,101,221,97,221" href="javascript:void(0)" onmouseover="voir(irlande)">
</map>
<!---FIN DES MAPS------/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////->
</body>
</html>

Citation :: Mouvement d'une fenêtre pop up
- Utilisation de setTimeout
- de move.resize moveTo et moveBy

Citation :: <html>
<head>
<title> MOVE BY </title>
<script language="javascript">
i=0

// Le fenêtre s'ouvre ainsi : On retaille la fenêtre en 800x400
window.resizeTo(800,400);
// On place la fenêtre à 100 du bord gauche et 200 du haut de la page
window.moveTo(100,200);
i=-1;
bouger=true;

function voyager(){
// mouvement de la fenêtre en horizontal et vertical ici 200 ne bouge pas car la fenêtre se déplacera horizontalement

if(bouger){
window.moveBy(i,0);
}
if(i<-150){
i--;
}
if(i<-1){
i++;
}
setTimeout("voyager()",10)
}

</script>
</head>
<body topmargin="150" onload="voyager()">
<center>

</center>
</body>
</html>

bon bah voila.............j ai toujours compris que la moitié et on est vendredi............................et le vendredi c est quoi?................................................
QUI a dis shabbat ?!
nan y a eval huhu , allez bon courage a tous et........."la force est avec nous !"

Shalom