Décalage texte/overflow et texte vibrant

Bonjour.

C'est la première fois que je poste sur ce forum et je tiens à dire bravo pour le travail réalisé au niveau des réponses et des tutos.
Le petit compliment étant placé, entrons dans le vif du sujet.

Je réalise actuellement un site en "essayant" d'utiliser du code CSS. C'est vraiment bien mais pour moi qui galère un peu en mise en page web (je suis graphiste à la base), il y a des inconnus:

1. Comment laissé un espace constant entre la barre de défilement placé avec un overflow: auto et le texte contenu dans la balise??

2. Est-il possible de réaliser avec du code CSS un lien texte ou image qui vibre de façon convaincante au survol?

Merci par avance.

PS: parlez lentement et comme si c'était à un gamin de 5 ans car je ne suis vraiment pas doué avec les CSS...
Modifié par hopemax32 (15 Sep 2006 - 20:11)

Je me répond et me fustige tout seul pour le premier point.
J'a repris les bases et regardé plus attentivement les tutos pour débutants.
La réponse à 1/2 rouble était l'utilisation de padding:.

Désolé pour l'encombrement.

La seconde partie concernant l'effet de vibration sur le lien me pose toujours problème.

Un exemple de ce que j'aimerais obtenir :
http://gordie.goldzoneweb.info/blog/

C'est l'effet donné aux liens du menu qui m'intéresse.
Modifié par hopemax32 (15 Sep 2006 - 21:00)

Bonsoir,

Impossible de faire vibrer un lien au survol en CSS (en javascript c'est envisageable). Mais la vraie question est plutôt : est-ce vraiment utile ou agréable pour l'utilisateur ? Tout dépend du sujet traité je pense, mais ce genre de "gadget" est vraiment à utiliser après mûre réflexion...

Ta question est pertinente Golog. En fait, c'est une demande d'un de mes amis. Le but est de réaliser un menu simple qu'il pourra modifier à sa guise.
Je vais regarder du côté du javascript alors.

Merci pour cette réponse rapide, Golog

Bonsoir hopemax32,

golog t'as donné une piste qui, il me semble, n'est pas la meilleure ...

L'effet de vibration est obtenu grâce à un gif animé. (La propriété CSS background-image lors du :hover fait changer le fond par le gif animé ...).

Il te faut donc faire une image pour chaque élément de ton menu & faire une 2e version en gif animé puis te servir de cette fameuse propriété CSS combiné au :hover.

Bonne continuation. Romain
Modifié par yodaswii (15 Sep 2006 - 21:21)

Bonsoir,

dans l'exemple que tu cites hopemax32 le "texte vibrant" est un simple gif qui s'affiche au survol;
l'image -> http://gordie.goldzoneweb.info/blog/themes/ben/img/menu/blog-over.gif

Ca peut donc être réalisé en CSS, en utilisant par exemple le code proposé dans ce tuto + un gif animé.

Mais comme le fait remarquer golog, est-ce vraiment utile/agréable ?

(edition) J'ai été grillé
Modifié par Hyp (15 Sep 2006 - 21:25)

Arf, je n'avais pas lu correctement, désolé ! Je n'avais vu que "lien texte"... Hum, vais m'acheter des lunettes moi

Hyp a écrit :
Mais comme le fait remarquer golog, est-ce vraiment utile/agréable ?

Disons que l'exemple cité est pas mal (même s'il manque furieusement d'un préchargement des images animées à afficher au survol), l'effet est assez subtil, et ça rappelle un certain style d'animation « approximative » à la Bill Plympton.

Du moment que le mouvement correspond à une action de l'utilisateur (survol), et n'est pas affiché par défaut (détail horripilant qui détourne l'attention du vrai contenu), pourquoi pas.
On peut effectivement émettre une mise en garde, mais il ne faut pas en faire une objection de principe.

Par contre, comme dit précédemment, on ne peut pas avoir le beurre et l'argent du beurre : soit on a une typo et/ou des effets travaillés, et donc on a des images fabriquées à l'avance avec un texte fixe, soit on laisse la possibilité de changer le texte et là il faut se rabattre sur des choses plus sobres.
Modifié par mpop (15 Sep 2006 - 22:03)