Popup et texte sélectionnable

Bonjour,

J'ai une liste de n items (n est variable et non prédictible).
Quand la souris survole chacun de ces items, je veux ouvrir une popup (ou une infobulle) qui donne des détails sur l'item en question.
J'ai trouvé comment faire en pur css ici , ou là.
Ca ne me convient qu'à moitié, parce que je voudrais permettre aux utilisateurs de sélectionner du texte à l'intérieur.
En utilisant la pseudo classe active en plus de hover,je peux rentrer dans la popup. Mais je ne peux pas y sélectionner du texte.

Voici la css :

a.info, a.info.link {
  position:relative;
}
a.info:active,a.info:visited {
   background: none;
   z-index: 500;
}
a.info span,a.info:link span {
	display	: none;
}

a.info:active span,a.info:hover span {
   display: inline;
   position: absolute;
   white-space: nowrap;
   font-size:1.1em;
   font-weight:normal;
   width:500px;
   height:15em;
   top: -5em;
   left: 50px;
   background: #e0e0e0;
   padding: 3px;
   border: 1px solid #5D779A;
   border-top: 4px solid #5D779A;
   border-bottom: 4px solid #5D779A;
}

Et le code html ressemble à :

<a href="#" class="info">Un item à survoler<span>Les détails pour l'item</span></a> 

Merci de votre aide.
J.L.

Bonjour,

Si tu veux pouvoir sélectionner le text, je pense qu'il te faudra utiliser du JS. Le CSS n'étant pas prévu pour générer les comportements mais uniquement la présentation des éléments HTML.

Yop,

Personnellement je te conseil également d'utilisé du JS pour ca va faire un tour du côté de jQuery qui te propose de belle infobulle facilement modifiable

Merci à toutes et à tous,

Je suis vos conseils, avec jQuery et probablement cluetip, je vais trouver de quoi faire.
Je donnerai un exemple dès que c'est au point.