Bienvenue
sur
Never-Utopia

Tu es déconnecté.

Never-Utopia

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.


    Affichage top et partenaires défilement

    Partagez
    MasculinAge : 31Message(s) : 31655

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    5/10  (5/10)
    Guilde des Architectes:
    3/10  (3/10)
    Okhmhaka
    le Dim 30 Aoû 2009 - 22:49
    Bonjour/soir à tous,

    La question ayant été posée pas mal de fois, je me permet de faire un topic expliquant comment faire défiler les logos des tops sites ou des partenaires d'un forum, le tout présenté en tableau plus ou moins élaboré.


    I- Le Basique :

    Pour un défilement horizontal basique des tops sites / partenaires, insérez sur votre accueil le code suivant :

    Simple :
    Code:
    <marquee><a href="adresse du site/forum"><img src="adresse de l'image" /></a></marquee>

    Pour en mettre deux l'une en dessous de l'autre, séparez les deux par le code :
    Code:
    <br>
    qui permet de faire un retour à la ligne.


    II- Les Différents styles de Scroll (=défilement) :

    Réduire la largeur / hauteur :

    Code:
    <marquee width="700px" height="50px"><a href="adresse du site/forum"><img src="adresse de l'image" /></a></marquee>
    width : largeur
    height: hauteur


    Couleur et cadre :

    Code:
    <marquee background-color="#000000" border="1px solid #ffffff" color="#ffffff"><a href="adresse du
    site/forum"><img src="adresse de l'image"
    /></a></marquee>
    background-color : couleur de fond
    border : bordures
    color : couleur du texte


    Styles et vitesse de défilement :

    Va-et-vient :
    Code:
    <marquee behavior="alternate"><a href="adresse du
    site/forum"><img src="adresse de l'image"
    /></a></marquee>

    Vitesse :
    Code:
    <marquee scrollamount="5"><a href="adresse du
    site/forum"><img src="adresse de l'image"
    /></a></marquee>
    Le chiffre de la vitesse est à adapter en fonction de celle souhaitée.
    1 = très lent
    20 = très rapide


    Directions :
    Code:
    <marquee directon="right"><a href="adresse du
    site/forum"><img src="adresse de l'image"
    /></a></marquee>
    Right = défilement vers la droite
    Left = défilement vers la gauche
    Up = défilement vers le haut
    Down = défilement vers le bas


    Remarque :
    Il est bien sûr possible de combiner autant de données que nécessaires !


    III- ...et si l'on exploite ?

    Il est tout à fait possible de mettre un scroll dans une case de tableau, ou une division, et ainsi, appliquer ensuite un fond image à ce cadre ou cette division.

    [suite à venir]


    Dernière édition par Sparrow-style le Mer 13 Juin 2012 - 23:24, édité 2 fois


    MasculinAge : 22Message(s) : 1497
    Shigeru
    le Dim 13 Sep 2009 - 18:50
    J'ai hâte de voir se tuto' ^.^


    MasculinAge : 36Message(s) : 9
    bmbslave4u
    le Mar 20 Oct 2009 - 13:26
    thanks!!!
    MasculinAge : 23Message(s) : 52
    kute aka stormwalker
    le Dim 8 Nov 2009 - 15:26
    merci pour cette aide :)


    MasculinAge : 21Message(s) : 118
    bossy
    le Jeu 30 Juin 2011 - 19:34
    merci

    edit : quand je met 2 fois le même code à la suite pour mettre mes partenaires, ils se placent l'un en dessous de l'autre, et non pas à la suite. Qui pourrait m'aider svp
    J'aimerais également que quand on passe le curseur de la souris, le défilement se stop jusqu’à ce qu'on l’enlève. Merci d’avance a celui ou celle qui m'aidera.


    FémininAge : 19Message(s) : 28
    Pupuce17
    le Jeu 22 Sep 2011 - 19:11
    Merci pour le tuto :]


    Panda panda panda !! : P I love Panda x)
    FémininAge : 27Message(s) : 24
    Ehlana
    le Mer 7 Déc 2011 - 22:57
    Merci pour le tutoriel, je me suis éclatée à combiner avec un tableau. C'était chiant, mais ça le fait Very Happy
    MasculinAge : 24Message(s) : 5
    Xam
    le Dim 5 Fév 2012 - 15:24
    Salut!! C'est un super Tuto merci beaucoup, mais, comme Natsu, j'aimerais pouovir positionner mes images l'une derrière l'autre et non l'une en dessous de l'autre.. C'est faisable?
    FémininAge : 20Message(s) : 196
    Shuu-Shuu
    le Dim 5 Fév 2012 - 15:49
    Merci beaucoup pour le tutoriel, il est très utile =)
    MasculinAge : 18Message(s) : 159
    Etax
    le Mar 26 Juin 2012 - 17:12
    merci


    FémininAge : 22Message(s) : 67
    Laluna
    le Mer 25 Juil 2012 - 18:52
    Mercii :3
    MasculinAge : 26Message(s) : 192
    Hayate747
    le Dim 7 Oct 2012 - 16:01
    Thanks you !
    MasculinAge : 24Message(s) : 19
    karma71620
    le Mar 18 Déc 2012 - 21:24
    merci beaucoup! :)
    FémininAge : 25Message(s) : 293
    lala zhang
    le Lun 21 Jan 2013 - 11:46
    Merci pour ce tuto
    FémininAge : 21Message(s) : 12
    Sweet's
    le Lun 21 Jan 2013 - 12:01
    Super Merci Sparrow pour ce tuto' !


    FémininAge : 18Message(s) : 10
    Chicaa
    le Sam 9 Mar 2013 - 18:06
    Merci pour le tuto, je ne savais même pas que l'on pouvait modifier la vitesse. **
    Merci encore! n.n
    FémininAge : 34Message(s) : 102
    Féli
    le Sam 29 Juin 2013 - 12:51
    toujours utile, merci


    MasculinAge : 25Message(s) : 93
    zereui
    le Dim 14 Juil 2013 - 12:57
    Merci!
    FémininAge : 24Message(s) : 76
    Mika-chan
    le Lun 12 Aoû 2013 - 23:45
    Merci pour ce tuto : )
    MasculinAge : 25Message(s) : 63
    teck
    le Ven 30 Aoû 2013 - 16:26
    merci


    FémininAge : 20Message(s) : 25
    Miley Destiny
    le Dim 13 Oct 2013 - 16:52
    Merci
    MasculinAge : 37Message(s) : 100
    Parka
    le Sam 19 Oct 2013 - 17:06
    @Shigeru a écrit:J'ai hâte de voir se tuto' ^.^
    MasculinAge : 21Message(s) : 72
    skaera22
    le Jeu 3 Avr 2014 - 15:33
    @Xam a écrit:Salut!! C'est un super Tuto merci beaucoup, mais, comme Natsu, j'aimerais pouovir positionner mes images l'une derrière l'autre et non l'une en dessous de l'autre.. C'est faisable?
    Invité
    le Mar 22 Avr 2014 - 13:43
    Merci.
    FémininAge : 22Message(s) : 57
    Fuyuka
    le Jeu 26 Mar 2015 - 14:35
    Merci pour l'aide =D
    Contenu sponsorisé
    Aujourd'hui à 22:22

      La date/heure actuelle est Jeu 29 Sep 2016 - 22:22