SELFHTML

Fenêtre d'affichage

Page d'information: vue d'ensemble

vers le bas Généralités sur la fenêtre d'affichage
vers le bas cursor (Curseurs)
vers le bas scrollbar (Propriétés Microsoft pour les barres de défilement)

 vers le bas 

Généralités sur la fenêtre d'affichage

Sur la fenêtre d'affichage, on peut déjà dire que c'est une partie de l'environnement de travail de l'utilisateur et non pas une place de jeux pour les ébats des auteurs de pages Web. La seule propriété de la fenêtre d'affichage à laquelle le consortium W3 permet l'accès est l'apparence du curseur. Cela se justifie en ce sens qu'il contribue activement à la fonctionnalité des pages Web.

Sur le bien-fondé des propriétés CSS dont Microsoft a doté l'Explorer Internet depuis la version 5.5, on peut avoir une opinion plus nuancée. Dans le cadre des concepteurs Web partisans, il peut être judicieux que les barres de défilement de la fenêtre du navigateur ou bien celles de champs de saisie à plusieurs lignes de formulaire s'accordent aux autres couleurs. D'un autre côté ces possibilités font naître de nouvelles envies chez ces gens qui aimeraient pouvoir grâce à leurs pages Web, allumer et éteindre l'ordinateur de l'utilisateur. Car naturellement ils veulent aussi ensuite mettre en forme la barre de menus et la barre d'outils du navigateur.

 vers le hautvers le bas 

CSS 2.0Netscape 6.0MS IE 4.0 cursor (Curseurs)

Vous pouvez définir un curseur pour un élément HTML. Si l'utilisateur passe avec la souris sur la surface occupée par l'élément, le curseur prend la forme mentionnée. Étant donné que les curseurs doivent toujours être liés à une signification, il est judicieux dans la pratique de lier de tels éléments à un Script à l'aide d'Event-Handler de JavaScript qui exécute alors certaines commandes.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<html><head><title>cursor</title>
</head><body bgcolor="#FFFFFF" text="#000000">

<div style="background-color:#F8F8FF; padding:10pt; border:thin solid black; width:100%; cursor:crosshair;">
<p>Ceci est un passage avec la mention <b>cursor:crosshair</b>.
Passez avec la souris sur ce passage.</p></div>

<!--etc...-->
</body></html>

Explication:

Avec cursor: vous pouvez modifier l'apparence du curseur pour le cas où l'utilisateur passerait la souris sur le passage correspondant. Les mentions suivantes sont permises:

auto = curseur automatique (réglage normal).
default = curseur standard indépendant de la plate-forme.
crosshair = curseur de la forme d'une simple croix.
pointer = curseur de la forme d'une flèche.
move = curseur de la forme d'une croix signalant la possibilité de déplacer l'élément.
n-resize = curseur de la forme d'une flèche pointant vers le haut (n = nord).
ne-resize = curseur de la forme d'une flèche pointant vers le haut à droite (ne = nord-est).
e-resize = curseur de la forme d'une flèche pointant vers la droite (e = est).
se-resize = curseur de la forme d'une flèche pointant vers le bas à droite (se = sud-est).
s-resize = curseur de la forme d'une flèche pointant vers le bas (s = sud).
sw-resize = curseur de la forme d'une flèche pointant vers le bas à gauche (sw = sud-ouest).
w-resize = curseur de la forme d'une flèche pointant vers la gauche (w = ouest).
nw-resize = curseur de la forme d'une flèche pointant vers le haut à gauche (nw = nord-ouest).
text = curseur sous une forme qui symbolise du texte normal.
wait = curseur sous la forme d'un symbole signalant l'attente.
help = curseur sous forme d'un symbole qui signale de l'aide pour l'élément.
url([fichier]) = curseur au choix, [fichier] doit être un graphique GIF ou JPG.

Attention:

Ne détournez pas les symboles de curseurs de leur finalité. Si par exemple vous utilisez cursor:move pour un élément, cet élément doit pouvoir être aussi effectivement déplacé (par exemple à l'aide de HTML dynamique)), et si vous utilisez cursor:help l'utilisateur attend qu'en cliquant sur le passage une fenêtre ou un passage avec un texte d'aide apparaisse à l'écran.

Netscape 6.x et l'Explorer Internet 5.x n'interprètent pas la mention url([fichier]).

 vers le hautvers le bas 

MS IE 5.x scrollbar (Propriétés Microsoft pour les barres de défilement)

Les propriétés décrites ici peuvent être utilisées sur des éléments comme body ou bien textarea. Avec body elles fixent les couleurs des barres de défilement de la fenêtre, avec textarea les couleurs des barres de défilement du passage de saisie.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<html><head><title>scrollbars</title>
<style type="text/css">
body, textarea {
  background-color:#8C8CC6;
  color:#FFFFFF;
  font-family:"Andale Mono",Arial,sans-serif;
  scrollbar-base-color:#8C8CC6;
  scrollbar-3dlight-color:#FFFFFF;
  scrollbar-arrow-color:#FFFFFF;
  scrollbar-darkshadow-color:#000000;
  scrollbar-face-color:#8C8CC6;
  scrollbar-highlight-color:#FFFFFF;
  scrollbar-shadow-color:#000000;
  scrollbar-track-color:#ACACE6;
}
</style>
</head><body>
<h1 style="text-decoration:underline">Ton sur ton</h1>

<form name="page">
<p>Vous pouvez &eacute;crire vous-m&ecirc;me le texte de cette page:</p>
<textarea name="texte" cols="80" rows="200"></textarea>
</form>

</body></html>

Explication:

Avec les propriétés suivantes, vous pouvez spécifier les différentes parties des barres de défilement:

scrollbar-base-color = couleur de base des barres de défilement
scrollbar-3dlight-color = couleur pour les effets de relief (3D)
scrollbar-arrow-color = couleur pour les pointeurs de défilement
scrollbar-darkshadow-color = couleur pour les ombres
scrollbar-face-color = couleur pour la surface
scrollbar-highlight-color = couleur pour le bord haut et le bord gauche
scrollbar-shadow-color = couleur pour le bord droit et le bord du bas
scrollbar-track-color = couleur pour la barre de défilement non-cachée par le pointeur de défilement

Pour toutes ces propriétés une Autre page d'information mention de couleur est possible.

 vers le haut
page suivante Autre page d'information Filtres (seulement Microsoft)
page précédente Autre page d'information Contrôle du son pour sortie vocale
 

© 2001 Stefan Münz / © 2003 Traduction Adresse électronique Serge François, 13405@free.fr
Adresse électronique selfhtml@selfhtml.com.fr