AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

-39%
Le deal à ne pas rater :
Pack Home Cinéma Magnat Monitor : Ampli DENON AVR-X2800H, Enceinte ...
1190 € 1950 €
Voir le deal

    Principe de défilement (Marquee)

    Lucky Numb£r
    Lucky Numb£r
    MasculinAge : 31Messages : 1972

    Mer 21 Avr 2010 - 1:54



    Hello c'est encore moi x)

    Édit Responsable (Onyx) : La balise marquee est une balise dépréciée, donc il est mieux d'utiliser des animations keyframes ou d'autres méthodes afin d'obtenir le défilement. Néanmoins, puisque la balise est encore utilisée à certains endroits, voilà encore le tuto.

    Maintenant je vais vous donner le secret des marquee ! Vous en rêviez, bien le voilà *.*

    Voilà la balise marquee toute seule donne ceci:
    c'est bidon
    Code:
    <marquee>c'est bidon</marquee>




    On peut ensuite utiliser le "behavior" pour lui indiquer comment se comporter.

    Voilà le behavior "slide" où le texte/image part d'un bord, va jusqu'à l'autre bord et s'arrête :
    YEAH !
    Code:
    <marquee behavior="slide"> YEAH ! </marquee>




    Voilà le behavior "scroll" où le texte/image part d'un bord, va jusqu'à l'autre bord, y disparait et recommence :
    YEAH !
    Code:
    <marquee behavior="scroll"> YEAH ! </marquee>




    Voilà le behavior "alternate" où le texte/image part d'un bord, va jusqu'à l'autre bord et rebondi :
    YEAH !
    Code:
    <marquee behavior="alternate"> YEAH ! </marquee>





    Ajoutez à cela le fait que vous pouvez donner une "direction" au défilement (down, right, left, up);
    Ainsi que le "scrollamount" permettant d'accélérer (quand on augmente le nombre) ou de ralentir (quand on diminue le nombre) la vitesse de défilement.
    De cette manière on peut obtenir une balise complète du style.

    Exemple complet :
    YEAH !
    Code:
    <marquee behavior="alternate" direction="right" scrollamount="50"> YEAH ! </marquee>




    Afin que le mouvement s'arrête lorsqu'on survole la balise, on peut utilise le "onmouseover" et "onmouseout" comme cela :
    Code:
    <marquee onmouseover="this.stop();" onmouseout="this.start();" behavior="alternate" direction="right" scrollamount="50">blablabla je suis trop fort, blablabla</marquee>

    À noter que le onmouseover et le onmouseout ne fonctionne pas dans les messages.




    C'est tout pour le moment, le reste nous vous laisserons le découvrir de vous-même ^^

    Merci de laisser un message pour donner vos impressions/commentaires/remerciements ^^



    CN.June
    CN.June
    FémininAge : 24Messages : 315

    Dim 25 Mar 2012 - 20:15

    J'aime beaucoup l'effet du dernier Marquee ! En tout cas, merci pour ce tuto très plaisant :'DD
    Hayate747
    Hayate747
    MasculinAge : 34Messages : 196

    Dim 7 Oct 2012 - 15:57

    Merci ! :)
    Sakira
    Sakira
    FémininAge : 31Messages : 89

    Mar 1 Jan 2013 - 22:33

    Merci XD



    Bientôt peut être o/
    Dépendra de ma motiv'
    Anonymous
    Invité

    Jeu 8 Déc 2016 - 22:12

    Merci!
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Mer 5 Avr 2017 - 17:53

    Je déplace vers les tutoriels ^^



    Contenu sponsorisé


      La date/heure actuelle est Dim 26 Mai 2024 - 1:12