Rechercher : dans
Par :

Info bulle reprenant le contenu du lien

Dernière réponse le 27 jan 2007 à 16:11:17 bg62, le 24 jan 2007 à 15:58:13 
 Signaler ce message aux modérateurs

Bonjour
j'ai eu un peu de mal à 'formuler' le titre, mais ,pour certains 'pro' ici, je pense que cela va être beaucoup plus clair si je vous mets le lien de l'exemple : http://www.dotnet-news.com/
lorsque l'on passe sur un lien, il y a une 'info-bulle' qui s'ouvre et qui reprend le début du texte contenu dans la page liée ... super ! (enfin pour moi)... comment faire ? (en restant le plus simple possible)
@mitiés
b g
le 'www' est fait aussi pour communiquer, partager et échang­er, non ?

Configuration: Windows XP
Internet Explorer 6.0

Meilleures réponses pour « info bulle reprenant le contenu du lien » dans :
[PHP] Lister le contenu d'un répertoire VoirGrâce à PHP, il est possible d'afficher le contenu d'un répertoire et de ses sous-répertoires. Voici ci-dessous une fonction permettant de parcourir récursivement les répertoires et sous-répertoires et d'en afficher les fichiers : function...
[PHP] Transformer une URL en lien hypertexte cliquable VoirGrâce aux expressions régulières, il est possible de transformer en lien hypertexte toute URL de la forme http://URL (ou ftp://URL) ou bien commençant par www. :
Tri à bulles -récursivité- VoirVoici une procédure récursive qui permet de trier un tableau de n entiers en utilisant la méthode de tri à bulles : Procedure Tri_bulles (var t : TAB; n : integer); Var i, aux : integer; Function Trier (t : TAB; n : integer) : Boolean; ...
RSS - Syndication de contenu VoirIntroduction au RSS Le standard RSS représente un moyen simple d'être tenu informé des nouveaux contenus d'un site web, sans avoir à le consulter. Le format « RSS » (traduisez « Really Simple Syndication ») permet ainsi de décrire de façon...
Faire un lien vers CommentCaMarche VoirVous êtes le bienvenu pour faire un lien vers CommentCaMarche.net ! Vous avez l'autorisation de faire pointer un lien vers la page d'accueil de CommentCaMarche.net ou bien directement vers un des articles. Si vous voulez agrémenter le lien d'une...
Webmastering - Contenu rédactionnel VoirImportance du contenu Les visiteurs reviennent généralement sur un site pour son contenu, plus que pour son design. Les études menées sur les internautes montrent que le facteur d'appréciation principal d'un site web est en premier lieu le contenu...

1

kij_82, le 24 jan 2007 à 17:11:50
  • +1

C'est quoi que tu ne sais pas faire, le système d'info bulle ?

Si oui, dans l'exemple que tu donne, il ne s'agit pas d'un truc bien compliqué en soit.
L'auteur a créer une DIV dans la page, dont la propriété 'z-index' est supérieur a celle des autres éléments de la page de manière à ce qu'elle soit toujours au dessus des autres éléments.
Ensuite, la propriété 'visible' de la DIV est mise par défaut (dans un css certainement) à la valeur "hidden" pour qu'elle ne soit pas visible.

Ensuite, l'auteur a construit sa page via une requête dans sa base de donnée pour extraire les différents liens, et les articles qui y correspondent.
Chaque lien se présente donc ainsi :

<a href="..." onMouseOver="javascript:Over('...')" onMouseOut="javascrip:Out('...')">BLABLA</a>


Les fonctions Over() et Out() sont des fonctions javascript dont la première prend en paramètre un texte, celui du lien en question.
Leur but, est :
- dans un premier temps, attribuer le texte à la DIV
- dans un deuxieme temps, afficher ou rendre invisible la DIV

Pour cela, il suffit de faire comme suit, en admettant que l'élément DIV en question ait pour identifiant le nom "ma_div" :
<script language="javascript">
function Over( texte ){
   var oDiv = document.getElementById("ma_div");
   // remplacement du texte :
   oDiv.innerHTML = texte;
   // apparition de la div :
   oDiv.style.visibility =  "visible";
}

function Out(){
   var oDiv = document.getElementById("ma_div");
   // Annule le texte 
   oDiv.innerHTML = "";
   // disparition de la div :
  oDiv.style.visibility = "hidden";
}
</script>


Et voilà, ce n'est pas plus compliqué que cela. Lorsque tu passera sur un lien, tu aura la DIV qui apparaitra à l'endroit où elle est, avec le texte du lien.
~ iclic @ gauch,iclic,  iclic @ droate, iclic, iclic
             et ya pas de bôg môsieu !    ~

Répondre à kij_82

2

bg62, le 24 jan 2007 à 20:03:20

Merci ... apparemment tu as tout compris ! ... moi pas tout à fait (je suis le genre 'boulet' quand il s'agit de quelque chose que je ne connais pas! )
tu me dis:
"L'auteur a créer une DIV dans la page, dont la propriété 'z-index' est supérieur a celle des autres éléments de la page de manière à ce qu'elle soit toujours au dessus des autres éléments.
Ensuite, la propriété 'visible' de la DIV est mise par défaut (dans un css certainement) à la valeur "hidden" pour qu'elle ne soit pas visible."
-elle a une place bien définie dans la page cette 'div' ?
- et cette histoire de css ça donnerait quoi exactement comme 'code' dans le fichier css ?
@mitiés
b g le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62

4

kij_82, le 25 jan 2007 à 10:37:41

Regarde le tuto donné plus bas, pour le fichier css :

.ma_div {
   position: absolute;
   top: 50;     // tes valeurs
   left: 400;  // tes valeurs

   z-index: 500;
   visibility: hidden;
}

.autreElement {
   ...
   
   z-index = 10;
}


Voilà ce que ca donne, tout cas dans un fichier "style.css" que tu importe dans ta page php via ce code entre tes balises STYLE de ton entete de page :
<HTML>
  <HEAD>
    <STYLE>
       @import url(style.css);
    </STYLE>
   </HEAD>
   <BODY>
   ...
   </BODY>
</HTML>
~ iclic @ gauch,iclic,  iclic @ droate, iclic, iclic
             et ya pas de bôg môsieu !    ~

Répondre à kij_82

6

bg62, le 25 jan 2007 à 15:37:48

Quelle est la différence entre
@import url(style.css);
et
<link href="styles.css" rel="stylesheet" type="text/css" />
php et html ??? c'est cela , mais pouquoi pas au même emplacement , là je ne comprends pas
@mitiés
b g le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62

7

kij_82, le 25 jan 2007 à 15:47:41

Aucune différence (enfin certainement que si mais infime), ca fait la même chose donc fais ce que bon te semble si tu es habitué à ta solution :)
~ iclic @ gauch,iclic,  iclic @ droate, iclic, iclic
             et ya pas de bôg môsieu !    ~

Répondre à kij_82

9

 bg62, le 27 jan 2007 à 16:11:17

Ok merci
j'espère que je vais y arriver ! le 'www' est fait aussi pour communiquer, partager et échang­er, non ?

Répondre à bg62

3

k1mpeR, le 24 jan 2007 à 21:26:54
Répondre à k1mpeR

5

bg62, le 25 jan 2007 à 15:32:39

Merci
j'ai regardé ce tuto, il est très bien fait !
mais ce n'est pas ce que je cherche (voir explications et lien dans mon premier post)
@mitiés
b g le 'www' est fait aussi pour communiquer, partager et échang­er, non ?

Répondre à bg62

8

bg62, le 25 jan 2007 à 16:07:38

Je ne sais pas ce qui se passe aujourd'hui ... mais cela fait la troisième fois que je dois me ré-identifier pour répondre à un 'post' du forum .... si quelqu'un sait ?
@+
b g le 'www' est fait aussi pour communiquer, partager et échang­er, non ?

Répondre à bg62