HTML : Dérouler du texte latéralement

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu HTML : Dérouler du texte latéralement

Message par Kirth Lun 8 Sep 2014 - 12:18

Bonjour !

Je cherche un code en HTML très similaire à celui proposé sur cette archive :
https://forum.forumactif.com/t308712-code-pour-derouler-un-texte

Cependant je voudrais que le déroulement se fasse sur la droite et non vers le bas, est-ce possible ? (J'ai essayé de bidouiller mais ça fonctionne pas du tout Sad ).

Merci d'avance !


Dernière édition par Kirth le Ven 12 Sep 2014 - 23:40, édité 1 fois
avatar

Kirth
Nouveau membre

Messages : 5
Inscrit(e) le : 08/09/2014

http://www.neverused.net/
Kirth a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par MlleAlys Lun 8 Sep 2014 - 13:11

Bonjour,
la balise qui permet en général de faire des défilement est la balise marquee, quelques recherches sur internet vous permettront ensuite de mieux connaitre les options qu'elle proposent ^^
Code:
<marquee direction="right" scrollamount="3" width="200px" height="50px">LE TEXTE DEFILANT ICI</marquee>
Modifiez "direction" pour le sens de défilement, "scrollamount" pour la vitesse de défilement, "width" et "height" pour la taille du bloc de défilement, et vous pouvez bien sûr ajouter de la mise en forme css. ^^


Dernière édition par MlleAlys le Lun 8 Sep 2014 - 13:13, édité 1 fois
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par Kirth Lun 8 Sep 2014 - 19:21

Ah non c'est pas du tout ce que je recherche ^^ marquee permet un défilement continu, là j'aimerais pouvoir dérouler un texte en passant la souris sur un mot / une image. C'est vraiment le même principe que celui présenté dans le sujet que j'ai posté avec mon message Smile

Le rendu recherché est celui-ci : http://phpbb2.123.st/t1-test-data-application-zip#6
mais à droite au lieu d'en bas.
avatar

Kirth
Nouveau membre

Messages : 5
Inscrit(e) le : 08/09/2014

http://www.neverused.net/
Kirth a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par MlleAlys Lun 8 Sep 2014 - 20:07

aaaaaaah pardon, j'étais à côté de la plaque @.@
un espèce de spoiler sur la droite alors !

Voilà un code sans transition, (c'est toujours plus facile ^^"), parce que je bidouille encore un peu pour en ajouter une ^^" :
Code:
<table class="open">
    <tr>
        <td valign="top">
            IMAGE OU TEXTE AFFICHé
        </td>
        <td class="cache">
            CONTENU CACHé
        </td>
    </tr>
</table>

et le css :
Code:
table.open td.cache {
    display:none;
}
table.open:hover td.cache {
    display:table-cell;
}

C'est bien un tableau dont je cache la cellule de droite, et je l'affiche seulement au passage de la souris sur le tableau. Avec ce code pas de problème de dimensions.
aperçu : http://jsfiddle.net/uf6k3p3a/

Je regarde si j'arrive à faire un effet potable avec une transition
(le souci que j'ai c'est qu'en jouant sur la largeur ça modifie la hauteur, et sinon je suis obligée de tout fixer, donc il faudra modifier à chaque fois les dimensions pour que ce soit les bonnes par rapport au contenu, ce qui n'est pas très intéressant ><")
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par Kirth Lun 8 Sep 2014 - 20:36

Ah ouais c'est déjà mieux merci ^^

Mais du coup sur le code de l'autre sujet, la personne avait réussi à modifier la hauteur du message (en fait quand le message apparaissait il décalait tout vers le bas). Et c'est ce que je cherche, pour ne pas avoir à prévoir d'espace prévu pour ce qui est caché.

De plus, le code était entièrement en html et il n'y avait pas besoin de css, j'aimerais savoir si c'est possible d'avoir un code entièrement en html.
(Edit : En fait le style css est pas compliqué à insérer dans du html donc j'ai rien dit sur cette dernière phrase).
avatar

Kirth
Nouveau membre

Messages : 5
Inscrit(e) le : 08/09/2014

http://www.neverused.net/
Kirth a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par MlleAlys Lun 8 Sep 2014 - 21:34

le code css avait été mis au début dans des balises style, comme ceci :
Code:
<style type="text/css">table.open td.cache { display:none; } table.open:hover td.cache { display:table-cell; }</style><table class="open"><tr><td valign="top">IMAGE OU TEXTE AFFICHé</td><td class="cache">CONTENU CACHé</td></tr></table>
et oui j'ai bien vu le principe du déroulement vers le bas grâce à une modification, malheureusement l'adaptation est un peu plus compliquée puisque, si limiter la hauteur ne modifiait pas la largeur, limiter la largeur par contre augmente la hauteur puisque automatiquement le texte revient à la ligne... d'où des effets pas très beaux ><" Et puis la hauteur de départ était celle d'une ligne, ici il faut que la largeur de départ s'adapte aussi à celle du texte ou de l'image visible...

bref, pour l'instant je bloque un peu, je ne suis pas satisfaite de ce que je trouve, mais quelqu'un d'autre y arrivera peut être avant moi ^^"
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par Kirth Mar 9 Sep 2014 - 10:53

D'accord je comprends le problème maintenant (oui ça me mettait bien le texte à la ligne et c'était pas très beau).
Mais en tous cas merci beaucoup pour vos réponses quand même ! Smile
avatar

Kirth
Nouveau membre

Messages : 5
Inscrit(e) le : 08/09/2014

http://www.neverused.net/
Kirth a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par [Nihil] Mar 9 Sep 2014 - 11:24

Hello,

Effectivement c'est plus compliqué à faire, mais c'est réalisable.
Tu veux faire quelque chose comme ceci c'est ça ? http://jsfiddle.net/zndn7cLo/
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par Kirth Mar 9 Sep 2014 - 11:41

Oui exactement !
Je vais essayer d'utiliser ça merci beaucoup Smile
avatar

Kirth
Nouveau membre

Messages : 5
Inscrit(e) le : 08/09/2014

http://www.neverused.net/
Kirth a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par MlleAlys Mar 9 Sep 2014 - 12:56

j'avais pensé à utiliser nowrap, mais du coup avec un texte plus long, on ne vois que le début ?
http://jsfiddle.net/694druym/1/
Quand je passe la souris dessus, je ne peux lire que "Donec leo arcu, dapibus at augue sed, fermentum vulputate ipsum. Proin consequat ju"
(par contre, je ne connaissais pas la syntaxe element+element, merci pour cette nouveauté ! o/ )
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par [Nihil] Mar 9 Sep 2014 - 13:11

Voici un exemple fait un peu différemment http://jsfiddle.net/694druym/2/

j'avais pensé à utiliser nowrap, mais du coup avec un texte plus long, on ne vois que le début ?
En fait si tu mets des balises br pour forcer le retour à la ligne, nowrap les prends en compte normalement ^^, mais effectivement oui il stop les retours à la ligne du aux limitations de taille du conteneur.
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par MlleAlys Mar 9 Sep 2014 - 13:58

je vois oui, fixer la largeur ^^ je cherchais trop parfais je crois, je cherchais pour que tout s'adapte seul ^^"
un inconvénient par contre avec un "survolez moi" séparé et qu'on ne peut pas survoler le texte sans qu'il se referme ^^" Dans ce dernier cas en plus un texte long entraine une barre de défilement, mais du coup impossible de défiler ^^"
Quelque chose comme ça peut être sinon, sans barre de défilement ?
http://jsfiddle.net/694druym/3/
ou alors en gardant l'overflow:auto, mais en insérant le content dans "ouvrir" pour pouvoir défiler sans souci ? ^^
http://jsfiddle.net/8t8aebd7/2/
En tout cas ce sont de bonnes alternatives quand même ^^
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: HTML : Dérouler du texte latéralement

Message par [Nihil] Mar 9 Sep 2014 - 14:12

un inconvénient par contre avec un "survolez moi" séparé et qu'on ne peut pas survoler le texte sans qu'il se referme ^^" Dans ce dernier cas en plus un texte long entraine une barre de défilement, mais du coup impossible de défiler ^^"
Oui j'avais vu ça mais j'avais un peu beaucoup la flemme de modifier mon code Mr. Green , mais tu as totalement raison
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum