Annexe

1. Script de détection

Voici un script (employé dans le tutoriel) qui détecte la version du navigateur du visiteur et qui renvoie vers les pages qui le concernent.

1. Première détection qui vérifie si le navigateur est bien Internet Explorer >=4; Si oui, renvoie vers la page ie5.html.
2. Si le navigateur n'est pas IE >=4, le script vérifie s'il s'agit de Netscape et dans ce cas, vérifie sa version : inférieure ou supérieure ou égale à 4. Dans le cas où le navigateur est de version inférieure, une alerte est donnée et le visiteur est renvoyé vers la page tel.html où il pourra télécharger une version plus récente;
3. Si le navigateur n'est pas Netscape, une alerte est donnée également et le visiteur est renvoyé vers la page versionautre.html, où il pourra vérifier si son navigateur comprend le "DHTML" et décider de poursuivre vers les pages qu'ils désirent...

Si vous n'êtes pas intéressé par les trois détections, vous supprimez celle qui ne vous intéresse pas.

Vous créez une page d'entrée de votre site (index.html par exemple) et vous aiguillez ainsi les visiteurs vers les pages qui les concernent (compatibilité DHTML par exemple).

<script language="JavaScript">
<!--
var ms = navigator.appVersion.indexOf("MSIE")
ie5 = (ms>0) && (parseInt(navigator.appVersion.substring(ms+5, ms+6)) >= 4)

// Détection du naviagateur Internet Explorer >=4

if(ie5){ top.location.href= "ie5.html";}

// Si pas IE >=4, détection de Netscape

if(!ie5){

net = navigator.appName == "Netscape"

// Si Netscape >=4

if((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0, 1)) >= 4))
{
top.location.href= "net.html";
}

// Si Netscape <4

else

if((navigator.appName == "Netscape") &&
(parseInt(navigator.appVersion.substring(0, 1)) < 4))
{

alert("\nLa version de votre navigateur ne vous permet pas de visualiser le DHTML ! \n\nLe tutoriel emploie cette nouvelle technologie, il est donc impératif de télécharger une version plus récente de votre navigateur ! \n\nÀ bientôt...");


top.location.href= "tel.html";
}

// Navigateur différent d'IE >=4 ou Netscape

if(!net){

alert("\nLa version de votre navigateur pourrait ne pas visualiser le DHTML ! \n\nLe tutoriel emploie cette nouvelle technologie et donc, la visualisation de celui-ci sera difficile ! \n\nSi votre navigateur permet néanmoins le DHTML, cliquer sur l'entrée correspondante...");

top.location.href= "versionautre.html";
}
}
//-->
</script>

Les caractères \n sont placés pour effectuer un retour à la ligne. Vous pouvez consulter les différents caractères spéciaux possibles, dans la section de TutorJS correspondante...

2. Pages exemples

Déplacements de texte :

1. Droite-gauche
2. Gauche-droite
3. Bas-haut
4. Haut-bas
5. Effet combiné de déplacement de texte (et transition IE) : combine.html

Propriétés particulières :

1. Apparition - disparition de texte
;
2. Effet de transition (IE);
3. Propriété : z-index;
4. Propriété : clip;
5. Propriété : Overflow;
6. Texte invisible sous Internet Explorer et visible sous Netscape (et inversément);
7. Éléments imbriqués;
8. Page HTML  avec une feuille de style globale dans laquelle on associe Classe (CLASS=) et Identification (ID=);
9. Document comprenant trois feuilles de style globales, correspondant aux trois résolutions d'écran habituelles;

3. Quelques liens

Voici quelques liens très intéressants qui pourront vous aider à poursuivre votre étude du DHTML :

Le site du W3C, section CSS-1.

Le site Ressources des Développeurs de Microsoft (MSDN online) qui est en complère reconstruction (US) : vous devez être membre pour certaines sections (c'est gratuit) mais de toute façon, vous avez accès à la page concernant le DHTML. Pour le DHTML, une page index à visiter (US) absolument...

Un super site (orienté IE) où vous trouverez de nombreux exemples et notamment un script qui rend compatibles vos scripts pour Internet Explorer vis à vis de Netscape (dhtmllib2.js) : www.siteexperts.com. Il est possible de vous abonner à un mailing et de recevoir ainsi chaque semaine les nouveautés du site (scripts - DHTML etc.)

Le site de Netscape où en faisant une recherche sur DHTML, vous trouverez de nombreux liens...

Les différents moteurs de recherche bien sûr...

Voici deux sites francophones, parmi d'autres, qui initient au XML : XML francophone ou le site du groupe EFA . Il en existe  bien d'autres à découvrir par votre recherche personnelle sur le Web...

Le site entièrement en français de Luc Van Lancker et qui vous donne de nombreuses explications sur l'HTML et qui comprend une section, très complère, sur de nombreux scripts DHTML : ceux-ci vous sont donnés avec les explications minimum d'emploi.

Enfin, si vous désirez une aide pour construire votre propre site, gratuitement, le site spécialisé de Visicom Media, WebDeveloppeur est incontournable et  Page-Web où vous trouverez, au fil du temps, d'autres scripts et/ou exemples DHTML.

Nous espérons que ce tutoriel vous ait donné l'envie d'employer le DHTML et les autres techniques qui y sont expliquées car celles-ci vont devenir, de jour en jour, de plus en plus indispensables à tout Webmaster.