Bienvenue sur FreeJavascript

PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
Je me suis appliqué quelques règles dans le développement de ces scripts :
  • utiliser les ressources DHTML (dynamic HTML), c'est-à-dire mettre en mouvement des pages
  • rendre les scripts compatibles avec une large palette de navigateurs : IE4, IE5, IE6, NS4 et NS6 (ou Mozilla 0.9)
  • alléger le plus possible le code : je suis adepte des moins de 5ko même si certains les dépassent légèrement; à ce titre, les images sont peu employées en dehors des scripts faits pour mettre en valeur ... des images, et des quelques groupes d'icônes développés et utilisés ici *
  • fournir des outils de construction en ligne tels que que j'utilise moi-même pour ces quelques pages
  • mettre ces outils à disposition en libre-service (merci de ne pas effacer le nom de l'auteur afin de permettre à chacun de retourver la source et d'en disposer)
* Cette page en est peut-être un contre-exemple, mais il s'agit là -en toute modestie- d'un ouvrage finement ciselé à l'image de l'œuvre d'un compagnon ! : et si on tentait la formation du "compagnon-du-net" et le concours du "meilleur ouvrier de la toile" ?
PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
Sous ce titre dans l'ère du temps se trouve des exemples de menus et leur mode d'emploi.
Si vous avez l'expérience fastidieuse de la mise à jour des menus et notamment ceux à plusieurs niveaux, alors vous trouverez une aide à la construction et à la mise à jour de ces menus (avec des fonctions de recopie, déplacement, création, suppression, etc...) qui vous facilitera la tâche.
NOTA : ces menus sont paramétrables dans leur contenu et dans leur style. En particulier, il reposent sur du texte et non des images beaucoup plus fastidieuses de mise à jour. cela n'empêche pas de produire des effets lors du passage de la souris avec changement de couleur de fond, effet d'enfoncement de touche pour les navigateurs prenant en compte certaines propriétés des feuilles de style.
Certains comportent également une information donnée dans une bulle ... "infobulle", mais qu'il faut savoir utiliser avec modération.












PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
ZOOM : L'originalité réside dans :
exemples
  • le couplage avec une infobulle apparaissant en-dessous de certaines zones réactives (personnages dans des photos de groupe -attention à obtenir l'accord des personnes et de la CNIL en cas diffusion sur le web : donc plutôt à réserver aux photos de famille ou photos de classe et promotion avec une diffusion restreinte-, ou bien carte routière comme sur les exemples ici),
  • et la production d'un menu produisant l'effet zoom au passage de la souris sur la rubrique.
application Le tout est généré à partir d'une application : page html qui génère une page html directement exploitable. L'utilisation requiert une bibliothèque "dhtml.js" en ligne, mais qui peut vous être fournie sur demande le cas échéant pour des applications locales.

Une réalisation atypique dans l'ensemble car il s'agit du traitement d'images. Je me suis inspiré d'un site de Salem Rahgmeh Beirut, Lebanon (site intitulé YTONG YETKÝLÝ SATICILAR) qui ne doit pas être le seul à avoir étudié ce cas d'école.
PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
Plan du Site :présentation multi-niveaux soit explorateur, soit gigogne, soit enfin déroulant

ONGLET :

Cette page en est une application concrète. L'idée est d'éviter les pages très longues en les divisant en sections visibles une par une, mais sans faire appel à chaque fois au réseau. Le passage d'une section à une autre se fait par l'onglet, soit en cliquant, soit comme dans certaines réalisations comme mon propre portail en glissant la souris par-dessus.
2 formes sont proposées -en cliquant sur les liens ci-dessous vous accédez au constructeur de sections- :
  • type 1 : l'onglet apparaît comme une fenêtre dans le haut de la section
  • type 2 : l'onglet apparaît au-dessus de la section
ainsi qu'une forme avec une couleur différente par onglet comme c'est le cas ici.

Rubriques :

le but est similaire à celui décrit ci-dessus : diviser de longues pages en sections en ne faisant apparaître qu'une section à la fois. Voir exemple et constructeur ici.

NetBook :

le livre explique lui-même la méthode d'élaboration ...

La notion d'onglet comble une lacune de html : cette notion est équivalente à la balise <card> du wap. Le livre est un exercice de style plus qu'un outil, mais peut être mis à profit pour mettre en valeur certains textes. On aurait pu combiner les 2 : onglet et netBook ... un projet en soi. Enfin, le "plan du site" qui permet souvent de se repérer facilement est une extension des menus multiples, c'est même l'idée de départ qui ensuite m'a permis de mettre en œuvre les fonctions récursives (une fonction qui s'appelle elle-même).
PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
Couleurs : le choix n'est pas facile dans la palette des couleurs. Je n'aime pas la codification du type #RRVVBB, je lui préfère les noms que j'ai rassemblés ci-après. Malheureusement, ces noms ne sont pas tous interprétés par tous les navigateurs; vous disposez ici d'une palette de 216 couleurs vous permettant quand même de choisir une couleur sous forme #RRVVBB.

InfoBulle :

incontournable infobulle permettant de mettre en évidence un point particulier notamment lors du survol d'un lien. Le lien va directement sur le mode d'emploi.

Scroll :

scroll

un scroll à multiples effets.

LED :

un ensemble de scripts développés voici quelques temps. La police constituée d'images .gif n'est pas de ma réalisation. A (re)-découvrir ici.
PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact

portail complet

www.clavier.fr.fm
  • Un clavier virtuel de type 1 : cyrillique, hebreu, arabe, latin
    nota : ce clavier conforme à la norme unicode.org est compatible IE4+, et NS6 ou Mozilla (risque de problèmes d'affichage avec NS4.x)
www.keyboard.fr.fm
  • Un clavier virtuel de type 2 : la même chose sous une autre forme
    nota : ce clavier conforme à la norme unicode.org est compatible IE4+, et NS6 ou Mozilla (risque de problèmes d'affichage avec NS4.x)
www.quid.fr.st
  • Un constructeur de quid.
www.flashscript.fr.fm
  • Un constructeur d'animations en Flash'Script : introductions animées de site en javascript prêtes à l'emploi. Flash'Script est à FlashTM ce que javascript est à javaTM : un moyen certes plus limité mais efficace et ouvert pour mettre en œuvre des animations.
www.organigramme.fr.st
  • Un constructeur d'organigramme.
www.lsf.fr.st
  • Une traduction de mots ou de phrases en langage des signes français. Très visuel ...
www.scrabble.fr.vu
  • Un jeu de scrabble conforme à la règle duplicate avec tirage au sort des lettres (2 voyelles et 2 consonnes avant 15 coups, 1 ensuite), calcul de points et sauvegarde automatique de la partie : pour s'entraîner ...
www.billard.fr.st
  • Un jeu de billard programmé en DHTML ! avec une table ovale, des plots et pleins d'autres artifices ...
PréfaceeMenu SolutionsZoomMise en pageTextes et couleursAutres sitesContact
Merci de me donner vos commentaires via votre messagerie habituelle ... ou en remplissant le questionnaire ci-après :
Nom, prénom ou pseudonyme Obligatoire
e-mail Obligatoire
Question ou Commentaire
Quoi de neuf en ligne ?
Quoi de neuf en ligne ?

www.freejavascript.fr.st

Création d'onglet : version 2.0 (génération et lancement automatique de la nouvelle feuille créée)

Création de rubrique : génération et lancement automatique de la nouvelle feuille créée

Création de scroll : possibilités multidirectionnelles

Générateur de menu : modification de l'interface plus conviviale

www.organigramme.fr.st

Création d'un organigramme multi-niveaux et application d'affichage et de navigation

www.flashscript.fr.fm

Modification de l'interface plus conviviale (mode graphique préférentiellement)

www.scrabble.fr.vu

Un jeu de scrabble conforme à la règle duplicate avec tirage au sort des lettres (2 voyelles et 2 consonnes avant 15 coups, 1 ensuite), calcul de points et sauvegarde automatique de la partie : pour s'entraîner ...

fermer !