Changer la couler de fond de l'attribut title

Bonjour

Savez vous s'il y a possibilité en CSS de changer l'aspect (couleur de fond ect..) des attributs title

img src="logo.png" alt="mon logo" title="aspect de ce texte"

merci

Bonjour,

L'aspect de l'infobulle n'est pas modifiable.
Pour obtenir un aspect différent, il faut créer une fausse infobulle en css que l'on stylera par après.
Modifié par Corinne S. (31 Mar 2010 - 17:14)

ok donc un div de survol

merci

Un tooltip javascript pas mal et sans images, jQuery Tiptip : http://code.drewwilson.com/entry/tiptip-jquery-plugin

merci , j'utilise du pur CSS et j'évite au maximum le javascript

kikoo!!!,

jehanon a écrit :
merci , j'utilise du pur CSS et j'évite au maximum le javascript

Une raison particulière ?

Par contre, j'aimerais signaler que sur une image, l'attribut title n'as pas vraiment de raison d'être.
Modifié par Hermann (01 Apr 2010 - 10:13)

Laurie-Anne a écrit :
Bonjour,
Une raison particulière ?

avant AJAX je n'ai jamais aimé le javascript , surtout quand on peut facilement l'éviter, et qu'il peut être désactivé cote client, ruinant d'un coup toutes nos pzages

Laurie-Anne a écrit :
Bonjour,
Par contre, j'aimerais signaler que sur une image, l'attribut title n'as pas vraiment de raison d'être.

bien sur que si, c'est une manière de glisser des mots clefs et de renseigner une image sur le survol de souris, ce qui n'a jamais été la fonction première de alt

jehanon a écrit :
bien sur que si, c'est une manière de glisser des mots clefs et de renseigner une image sur le survol de souris, ce qui n'a jamais été la fonction première de alt

Pour ce qui est de glisser des mots clefs, c'est moyen moins comme pratique.
Par contre, il peut s'agit de préciser la fonction d'une icône ou d'une image peu compréhensible.

Corinne S. a écrit :

Pour ce qui est de glisser des mots clefs, c'est moyen moins comme pratique.

non c'est un très bon moyen au contraire
et ça se juge uniquement à la position dans les moteurs de recherche

jehanon a écrit :
bien sur que si, c'est une manière de glisser des mots clefs et de renseigner une image sur le survol de souris, ce qui n'a jamais été la fonction première de alt

Ce n'est pas non plus la fonction de title...

jehanon a écrit :
non c'est un très bon moyen au contraire
et ça se juge uniquement à la position dans les moteurs de recherche

Bien que je ne soit pas experte en SEO, j'en doute très fortement.


'fin bref, c'est pas comme si les bonnes pratiques du web étaient importante.
Modifié par Laurie-Anne (01 Apr 2010 - 10:22)

Kikoo!!!

jehanon a écrit :

non c'est un très bon moyen au contraire
et ça se juge uniquement à la position dans les moteurs de recherche

Raté Le contenu du title a très peu ou pas du tout d'impact en matière d'indexation.

Le title doit servir à insérer des metadonnées (infos exif, format, auteur...)

Laurie-Anne a écrit :
Ce n'est pas non plus la fonction de title...

W3C >> title Attribute Value >> A tooltip text for an element

Laurie-Anne a écrit :

Bien que je ne soit pas experte en SEO, j'en doute très fortement.

oui je vous que tu n'es pas experte

pour le référencement une seule valeur prime : la position

en tant que modératrice je te trouve assez légère sur ce sujet

Hermann a écrit :
Kikoo!!!
Raté Le contenu du title a très peu ou pas du tout d'impact en matière d'indexation.

très bien n'en met pas , où est le problème ? ça fera de la place )

jehanon a écrit :
en tant que modératrice je te trouve assez légère sur ce sujet

Bah on est le premier avril et je suis la tradition anglaise.

Ne pas être experte ne signifie pas que je n'ai pas de bases solides.

jehanon a écrit :
où est le problème ?

Le problème c'est que mettre des "mots clés" dans une balise titles sur une image, c'est de la "pollution" pour les utilisateurs ; dans la plupart des navigateurs, le title est affiché au survol de l'image, si les info qu'il contient ne lui apportent rien, elles seront gênantes pour le visiteur.
Modifié par Laurie-Anne (01 Apr 2010 - 10:40)

7.4.3 The title attribute

Attribute definitions

title = text [CS]
This attribute offers advisory information about the element for which it is set.

Unlike the TITLE element, which provides information about an entire document and may only appear once, the title attribute may annotate any number of elements. Please consult an element's definition to verify that it supports this attribute.

Values of the title attribute may be rendered by user agents in a variety of ways. For instance, visual browsers frequently display the title as a "tool tip" (a short message that appears when the pointing device pauses over an object). Audio user agents may speak the title information in a similar context. For example, setting the attribute on a link allows user agents (visual and non-visual) to tell users about the nature of the linked resource:

jehanon a écrit :
advisory information

Des mots clés pour les moteurs de recherche (car c'est que tu fais) ce n'est pas une information apportant un conseil (c'est, plutôt, comme l'a signalé hermann des metadonnées).

qui t'as dit que j'y mettais une suite de mots clefs ?

bref ! ça sert à rien de discuter , le problème de ce fil est résolu , RDV dans les moteurs de recherche

je clôture

merci à tous

jehanon a écrit :
je n'ai jamais aimé le javascript, il peut être désactivé cote client

CSS aussi…

Salut,

jehanon a écrit :
qui t'as dit que j'y mettais une suite de mots clefs ?

bref ! ça sert à rien de discuter , le problème de ce fil est résolu , RDV dans les moteurs de recherche

je clôture

merci à tous

Si tu n'as pas changé d'avis sur la résolution de ton problème, pourrais-tu s'il te plait l'indiquer comme [Résolu] ? Merci d'avance.

Bonjour,

Pour une info-bulle en CSS ceci (parmi d'autres solutions) peut convenir :
d'abord un gros patacaisse pour pouvoir vérifier par un simple « copi-collage », je vous laisse le soin du doctype et compagnie.

<body>
	<p>Cum lupa saepius ad parvulos veluti ad catulos reverteretur, Faustulus, pastor regius, rem animadvertit, eos tulit in casam et Accae Laurentiae coniugi dedit educandos. Qui adulti inter pastores primo ludicris certaminibus vires auxere, deinde, venando saltus peragrare coeperunt, tum latrones a rapina pecorum arcere. Quare iis insidiati sunt latrones, a quibus Remus captus est. Romulus autem vi se defendit. Tunc Faustulus necessitate compulsus indicavit Romulo quis esset eius avus, quae mater. Romulus statim, armatis pastoribus Albam properavit.</p>
<p>Bla bla bli <a class="info" href="#">CSS<span class="info_bulle">Cascading Style Sheet (feuille de style en cascade)</span></a> bla bla bla.</p>
<p>Cum lupa saepius ad parvulos veluti ad catulos reverteretur, Faustulus, pastor regius, rem animadvertit, eos tulit in casam et Accae Laurentiae coniugi dedit educandos. Qui adulti inter pastores primo ludicris certaminibus vires auxere, deinde, venando saltus peragrare coeperunt, tum latrones a rapina pecorum arcere. Quare iis insidiati sunt latrones, a quibus Remus captus est. Romulus autem vi se defendit. Tunc Faustulus necessitate compulsus indicavit Romulo quis esset eius avus, quae mater. Romulus statim, armatis pastoribus Albam properavit.</p>
	</body>

Puis le code CSS pour l'info-bulle

<style type="text/css">
      html, body {margin: 0;padding: 0;
      font-family: verdana, arial, sans-serif;}
      p {
         position: relative;
      }
      a.info span.info_bulle {
         display: none;
      }
      a.info:hover span.info_bulle, a.info:focus span.info_bulle {
         display: inline;
         position: absolute;
         margin-top: -1.5em; /* remonter d'une ligne et demi */
         padding: 2px 5px;
         background: #360;   /* vert Napoléon */
         color: #FFF;        /* blanc */          
      }
      /* rappel important : le focus sert à voir l'infobulle pour la navigation clavier */      
</style>