Gloubi tuto – texte changeant de couleur

Cette fois-ci encore, j’ai décidé de m’attaquer à un autre gloubi script d’effet sur texte, le texte changeant de couleur.

Une fois de plus, dû à l’évolution des technologies, plus besoin de JavaScript pour obtenir un résultat identique (ou en tout cas très proche).

Fonctionnement du script

On indique au script les couleurs (du texte et du fond) entre lesquelles faire une transition. Ces couleurs sont définies chacune par trois variables (ce qui nous fait 12 variables en tout) contenant une valeur décimale (entre 0 et 255) qui sera ensuite convertie en hexadécimal sur deux digits (entre 00 et FF) pour indiquer la couleur sous la notation #RRGGBB.

Les valeurs des différentes composantes sont progressivement incrémentées puis décrémentées entre les valeurs bornes.

Continuer la lecture

Gloubi script – texte avec un arrière-plan défilant

Aujourd’hui nouveau tuto sur un gloubi script d’effet sur texte. Cette fois ci, il s’agit de texte avec arrière-plan défilant.

Principe du script

Le script original est disponible sur sa propre page sur le site de notre gloubi adversaire.

Il fonctionne selon le principe de calques : au-dessus du calque de motif, on place un autre calque où le texte fait des « trous », laissant voir ce que l’on place dessous (ici notre calque de motif).

Le calque de motif est plus grand que le calque supérieur, mais on masque ce qui est en dehors de la zone du calque supérieur. Ce calque de motif est ensuite déplacé par du code JS.

Continuer la lecture

Gloubi tuto – menu interactif déroulant

Cette semaine, attaquons-nous à un autre script de menu présenté chez notre gloubi adversaire.

Ce script est visible sur cette page, et est toujours fonctionnel dans les navigateurs modernes.

Fonctionnement

Le menu produit par ce script se présente sous la forme d’un tableau dans un tableau (je parle là des balises HTML).

<table>
    <tr>
        <td>Rubrique</td>
    </tr>
    <tr>
        <td>Liens....</td>
    </tr>
    <tr>
        <td>Rubrique</td>
    </tr>
    <tr>
        <td>Liens....</td>
    </tr>
</table>
Continuer la lecture

Les dégradés en CSS

Comme sous-entendu dans un précédent gloubi tuto, il est maintenant possible avec CSS3 de créer des dégradés de couleurs.

Pour CSS, les dégradés sont considérés comme des images, et donc doivent être utilisés dans l’attribut background ou background-image d’une déclaration de style.

Il existe en CSS 3 types de dégradés :

  • les dégradés linéaires : les couleurs sont étalées le long d’un axe
  • les dégradés radiaux : les couleurs sont étalées depuis un point dans deux axes
  • les dégradés coniques : les couleurs sont étalées autour d’un cercle
Continuer la lecture

Comment marche le HTML ?

Comme vu précédemment le HTML est un des piliers du Web. Nous allons voir ici comment ça marche.

Les balises

La base du HTML est le principe de balises. Une balise est là pour délimiter une zone. en HTML, une balise s’écrit à l’aide de chevrons; exemple: <p>.

En HTML, sauf exception, les balises fonctionnent par paire: une balise ouvrante, et une balise fermante; exemple: <p></p>.

Continuer la lecture