Suivez ce TOPO en plein écran
Page 1
Les Actions sur les pointeurs
Le principale but des scripts qu'ils soient écrit
en JAVA ou en VB Script est de
MANIPULER les données HTML
pour atteindre ces données les scripts emploient des
Pointeurs
Regardons sur quelques exemples comment définir nos pointeurs :
il existe deux moyens de désigner un élément:
par son nom si il existe, ou par un termecomposé a partir de son
ID
deux exemples de noms :
document désigne l'ensemble de la fenétre du document en cours
screen désigne l'écran de l'utilisateur
deux exemples avec ID : par exemple une Image dont l'ID=Image1
Image1.src désigne le chemin et le nom du fichier Image
Image1.style.visibility désigne son attribut de visibilité par exemple visible
Page 2
Si nous avons un élément décrivant une image
<IMG id=Image1 src="c:\mesimages\jpiaxx.jpg"
style=" LEFT: 70px; POSITION: absolute; TOP: 25px; VISIBILITY: hidden; Z-INDEX: -1"
width=120 height=150 >
nous pouvons dans un script écrire :
<SCRIPT language=VBScript>
dim JP,JP1 ' ce qui dimensionne les variables dont les noms sont JP et JP1
JP=Image1.src
JP1=Image1.width
Image1.style.visibility="visible"
</SCRIPT>
telle que nous avons écrit ce script, la variable JP contient c:\mesimages\jpiaxx.jpg
et la variable JP1 contient 120
enfin l'image est devenue visible
Page 3
Reprenons notre exemple
<IMG id=Image1 src="c:\mesimages\jpiaxx.jpg"
style=" LEFT: 70px; POSITION: absolute; TOP: 25px; VISIBILITY: hidden; Z-INDEX: -1"
width=120 height=150 >
<SCRIPT language=VBScript>
dim JP,JP1
JP=Image1.src
JP1=Image1.width
Image1.style.visibility="visible"
</SCRIPT>
Regardez le contenu de <IMG vous voyez que :
style et
width
sont des éléments directes de l'image
Alors que visiblity
est dans les " " de style="......."
c'est donc un sous ensemble de style et pour l'atteindre il faut décrire son chemin
comme le CHEMIN DES REPERTOIRES POUR ATTEINDRE UN FICHIER
Image1.style.visibility
Page 4
Nous pouvons donc agir sur ces éléments
par exemple réduisons l'image comme un zoom par deux
et changeons la place de l'image,il suffit d'écrire
<IMG id=Image1 src="c:\mesimages\jpiaxx.jpg"
style=" LEFT: 70px; POSITION: absolute; TOP: 25px; VISIBILITY: hidden; Z-INDEX: -1"
width=120 height=150 >
<SCRIPT language=VBScript>
Image1.width=Image1.width/2
Image1.height=Image1.height/2
Image1.style.top="40px"
Image1.style.left="50px"
</SCRIPT>
Rappelons que la position désigne la place de l'angle haut/gauche
de l'image par rapport au bord de la fenétre et non pas de l'écran
Page 5
Double cas particulier:
Lorsque nous employons des filtres, ceux ci font partis du style
mais pour atteindre un de leurs paramétre,
nous pouvons les désigner directement Regardez ce cas :
<DIV id=Montxt 'il sagit d'un texte utilisant trois filtres
style="COLOR: #000000; FONT-FAMILY: Comic Sans MS; FONT-SIZE: 80pt;
VISIBILITY:hidden; WIDTH: 100%; filter:wave(freq=8,strength=30, phase=0, lightstrength=0, add=0, enabled=1)
glow(strength=12, color=#A0A0FF,enabled=1)
shadow(color=#FFFFFF,direction=90,enabled=1)">
Un texte quelconque</DIV>
<SCRIPT language=VBScript>
Montxt.filters(0).phase = 24
Montxt.filters(0).strength = 48
Montxt.filters(1).strength = 52
</SCRIPT>
En regardant bien le détail de ce DIV vous constaterez qu'il existe trois
filtres ,en plus vous voyez que l'attribut "strength" est
présent dans deux de ces filtres.Pour agir précisément sur l'un
d'entre eux ,on utilise le rang (Numéro) du filtre sachant que
le premier est (0) le deuxiéme (1) etc...
ainsi Montxt.filters(1).strength agit sur le parametre strength du filtre glow
Page 6
Autres pointeurs
Il existe d'autres pointeurs ,je devrais dire mot clé comme
all
this
parentElement
children
Etc....
qui feront l'objet d'un TOPO séparé.Vous y verrez par exemple
des désignations comme document.all.tags("DIV")[0].all.tags("P")
cas traité dans "Atelier Dynamique HTML".
Page 7
Autres moyens d'actions
parmi les autres moyens d'actions il faut citer :
write ou writeln pour ajouter du code Html ou du texte dans le message d'origine
la différence entre write et writeln est que derriére le code ajouté par writeln
se place un retour a la ligne.<BR>
On peut écrire également du texte et du code HTML a un endroit précis grace a
innerHTML qui désigne la zone de texte d'un élement
<HTML> <BODY>
<DIV id=toto> </DIV> <DIV id=titi> </DIV>
<SCRIPT language=VBScript>
JPB="<FONT COLOR=#ff0000>Vive Voyeur"
titi.innerHTML=JPB
</SCRIPT>
ici la phrase "Vive Voyeur" se placera en rouge dans le DIV dont l'Id=titi
Page 8
Des données utiles
voici les principaux éléments métriques ,valables en VBScript comme en JAVA Script
document.body.offsetWidth largeur de la fenétre utilisateur compris barre de scroll
document.body.offsetHeight hauteur de la fenétre utilisateur compris barre de scroll
document.body.clientWidth largeur de la fenétre utilisateur sans barre de scroll
document.body.clientHeight hauteur de la fenétre utilisateur sans barre de scroll
document.body.scrollTop place en hauteur de la fenétre dans l'écran
document.body.scrollLeft place du bord gauche de la fenétre dans l'écran
document.body.scrollHeight place du curseur scroll verticale
document.body.scrollWidth place du curseur scroll horizontal
screen.width définition en largeur de l'écran utilisateur (640 par exemple)
screen.height définition en hauteur de l'écran utilisateur (480 par exemple)
screen.colorDepth couleur (bits par pixel) de l'utilisateur (16 par exemple)
regardez sur la page suivante le résultat !
Page 9
Page 10
Voila A+ pour aller plus loin sur les manipulations de code HTML grace a l'utilisation de scripts VB ou JAVA