JARIA est une bibliothèque de fonctions développées pour faciliter l'intégration de JavaScript.

     
IE 6+
FF 2+
Opera 9+
Safari 2+
Chrome

Gestion des éléments du document

fichiers nécessaires <link href=jaria/jaria.css rel=stylesheet type=text/css />
<script src=jaria/jaria.js type=text/javascript></script>

La fonction oEl() gère les éléments
oEl.test (id) test l'élément et affiche une box erreur en cas ou celui-ci n'existe pas. oEl.get();   oEl.get("toto");
oEl.get (id) retourne l'élément dont la valeur de l'attribut id est passé en paramètre

  string = oEl.get (id).val([string]) affecte et retourne une valeur à un élément de formulaire
  string = oEl.get (id).html([string]) affecte et retourne une chaine HTML à un élément conteneur
  oEl.get (id).txt([string]) ajoute un node texte à l'élement conteneur
  string = oEl.get (id).tag() retourne le nom du tag de l'élément Exemple
  element = oEl.get (id).parent() retourne le parent de l'élément Exemple
  oEl.get (id).first(element) ajoute un nouvel élément en premier dans l'élément conteneur
  oEl.get (id).before(element) ajoute un nouvel élément avant
  oEl.get (id).after(element) ajoute un nouvel élément après
  oEl.get (id).del() supprime l'élément
  integer = oEl.get (id).top() retourne la position top (Y) de l'élément Exemple
  integer = oEl.get (id).left() retourne la position left (X) de l'élément Exemple
  integer = oEl.get (id).sizeX() retourne la largeur de l'élément Exemple
  integer = oEl.get (id).sizeY() retourne la hauteur de l'élément Exemple
  oEl.get (id).css(JSON) affecte un ou plusieurs style CSS par un objet ou une chaine JSON  Exemple

oEl.gettags (string, [parent]) retourne la collection de tous les éléments par le nom du tag dans le document(défaut) ou dans l'élément parent(facultatif)
oEl.gettag (string, integer, [parent]) retourne un élément par le nom du tag à parti de la position 1 dans le document(défaut) ou dans l'élément parent(facultatif)
oEl.create (tagName) crée un nouvel élément du document par son tagName
oEl.del (el) supprime un élément du document par l' objet ou l'id
oEl.deltags (tagName, [parent]) détruit la collection tous les éléments par le tagName du document(défaut) ou de l'élément parent(facultatif)
oEl.getframe (el, [id]) retourne le document(DOM) ou l'élément[facultatif] du document de l'iframe Exemple
oEl.create (tagName) crée un élément par le tagName

création d'un élément /* création d'un élément input */
var el = oEl.create(input);
/* ajout de tous ses attributs */
el.type = text;
el.name = letext;
el.id = letext;
el.value = valeur du texte;
el.className = jaria_input;
/* insertion de l'élément dans le document */
oNav.body.appendChild(el);

création    suppression  
oEl.opacity (element, integer) affecte la transparence d'un élément (valeur: 0 à 100)
oEl.getopacity (element) retourne la valeur de l'opacité d'un élément (valeur: 0 à 100)
oEl.getclass (class, [parent]) retourne un tableau d'élément(s) dont la classe est passée en paramètre
oEl.addclass (element, class) ajoute une classe CSS à l'élément
oEl.delclass (element, class) supprime une classe CSS à l'élément
oEl.getstyleclass (element, style) retourne la valeur du style de la classe CSS d'un élément
oEl.getoffset ( element, propriete) retourne la position réelle en pixels d'un élément par rapport au document
oEl.getevent (event) retourn l'élément par un évènement sur celui-ci <a>Exemple</a>
oEl.setinscreen(el) repositionne un élément à l'intérieur de la fenêtre du navigateur. Exemple
oEl.text (string) crée un élément texte. Exemple
oEl.visible (el, etat) affecte la visibilité d'un élément selon l'état true / false
oEl.fader applique une transition progressive de l'opacité sur un élément
oEl.fader.plus (element, [temp]) transition positive de l'opacité sur l'élément Exemple
oEl.fader.moins (element, [temp]) transition négative de l'opacité sur l'élément Exemple
le paramètre temp est facultatif et modifie la durée de transaction de l'opacité
oEl.fader.valid() action à redéfinir après la transition négative ou positive de l'opacité sur l'élément
oEl.title.go remplace l'affichage standard des infobulles du document par des infobulles html personalisées.

utilisation <script type=text/javascript>
<!--
  function Load(){
    /* remplace les infos bulles standard */
    oNav.addevent(onmousemove, oEl.title.go);
  }
  /* ajoute la fonction Load() à l'évènement window.onload */
  oNav.addevent(onload, Load);
-->
</script>

Exemple avec title=this.ajax=43;
Exemple avec title=this.previsu=images/previsu/previsu_el.png;Fonctions de l'élément
en savoir plus...
oEl.inc gestion des champs spéciaux numériques incrémentables par deux boutons plus(+) et moins(-)
oEl.inc.init() initialise tous les champs input de type text dont la classe est définie par oEl.inc.cl = classname (jaria_inc par défaut)
oEl.inc.params(el, mini, maxi, step, [default]) définie les paramètres du champ par l'élément ou l'identifiant, la valeur minimum (-999 par défaut), la valeur maximum (999 par défaut), l'incrémentation (1 par défaut) et optionnellement la valeur par défaut (0 par défaut)

code JavaScript <script type=text/javascript>
<!--
  function Load(){
    /* initialise les champs incrémentables */
    oEl.inc.init();
    /* modifie les paramètres de certains champs incrémentables*/
    oEl.inc.params(champ2, -10, 10, 1, 10);
    oEl.inc.params(champ3, -10, 10, 2, -10);
    oEl.inc.params(champ4, 50, 60, 1, 60);
    oEl.inc.params(champ5, -60, -50, 1, -55);
    oEl.inc.params(champ6, -1, 1, .1, 0);
    oEl.inc.params(champ7, -1000, 1000, 100, 0);
  }
  /* ajoute la fonction Load() à l'évènement window.onload */
  oNav.addevent(onload, Load);
-->
</script>
code HTML <input type=text id=champ1 class=jaria_input jaria_inc value=0 />
<input type=text id=champ2 class=jaria_input jaria_inc value=0 />
<input type=text id=champ3 class=jaria_input jaria_inc value=0 />
<input type=text id=champ4 class=jaria_input jaria_inc value=0 />
<input type=text id=champ5 class=jaria_input jaria_inc value=0 />
<input type=text id=champ6 class=jaria_input jaria_inc value=0 />
<input type=text id=champ7 class=jaria_input jaria_inc value=0 onchange=alert(oEl.get('champ7').value) />

oEl.sound crée un élément son [embed]
oEl.sound.play (file) joue le son passé en paramètre
oEl.sound.stop() détruit l'élément son
oEl.sound.autostart = boolean auto-démarrage du son
oEl.sound.loop = boolean lecture en boucle
  Exemple (nécessite un "plug-in" comme QuickTime© pour certains navigateurs):  play  stop 
oEl.chrono chronomètre appliqué à un champ
oEl.chrono.start (id) démarre le chronomètre et affiche la valeur en secondes dans le champ dont l'identifiant est passé en paramètre
oEl.chrono.pause (id) Arrête le chronomètre
oEl.chrono.stop ([boolean]) arrête le chronomètre et initialise la valeur à zéro. le champ est remis à zéro si le paramètre est vrai.