Info bulle click here

Fermé
lana - 23 oct. 2011 à 13:55
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 - 25 oct. 2011 à 11:33
Bonjour,
salut
Autre fois j'ai reçu beaucoup de réponse sur ceci, mais j'ai dû oublier, je voudrais sur mon image que j'ai mis sur mon site, des que ma souris passe, une info bulle apparaît, en bas "Click here" le code source je l'ai, mais juste je ne sais pas ou le mettre, eeeh je suis débutante
Voila mon code source :

<table width="1304" height="858" border="0">
<tr>
<td colspan="2" rowspan="2"><img src="voir.png" alt="" width="1269" height="918" border="0" usemap="#Map" />
<td width="852"> </td>
<td width="25"> </td>
</tr>
<tr>
<td height="757"> </td>
</tr>
<tr>
<td><div id="apDiv8">
<embed src="melodyloops-equa-mp3-player_.swf" width="25" height="16" loop="False" allowscriptaccess="always" allowfullscreen="false" flashvars="filename=samba.mp3&timeplay=0&volume=50&backcolor=#000&maincolor=FFFFFF"> </embed>
</div></td>
<td> </td>
<td height="24"> </td>
</tr>
<tr>
<td width="593"> </td>
<td width="672"><span class="Style2">©2011 BE RCI </span></td>
<td height="46"> </td>
</tr>
</table>

<map name="Map" id="Map">
<area shape="rect" coords="117,10,1196,982" href="Index.html" />
</map>

et Voila l'autre :

<a href="../Index2" title="Cliquez ici ..." style="cursor:pointer;"><img src="fifaworld.png" alt="" width="859" height="1072" /></a></td>

je le place ou???


merci d'avance de votre aide
A voir également:

2 réponses

arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
23 oct. 2011 à 15:37
La structure de ta page est faite avec un tableau.
Ceci ne sont absolument pas fait pour ça.
Je te conseil de te tourner vers CSS pour faire ta page correctement.

Pour ce qui est de ton image, la question serait plutôt de savoir où est-ce que tu veux la placer dans ta page?
Le placement dans ton code HTML se fera naturellement en fonction de ça.
0
JooS Messages postés 2468 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
23 oct. 2011 à 16:21
Salut ...

Ta question ne correspond pas vraiment au titre du post !!!

pour créer une info bulle simple(html), il te suffit d'ajouter l'attribut title a la balise voulu ...

Exemple :

<h2 title="Texte de l'info bulle">Mettez la souris ici</h2>

<img src="fifaworld.png" title="Info bulle de l'image" alt="" />


Voila ...
0
aaah saaalut JooS
bon j'ai reçu autre fois le code cité en haut, mais c'est bon, j'ai réglé le problème, mais j'ai un autre, je pense que je t'ai parler de mon site de sport et je t'ai dite que je voulais mettre un bouton flash qui stoppé et mettre en marche en marche une musique? je l'ai faite, mais juste le problème que j'ai c'est que la musique s'arrête des qu'elle se termine,moi je jeux q'elle marche en boucle, elle se répète jusqu'à ce que l'utilisateur l'arrête. Voila mon code source :

<div id="apDiv8">
<embed src="melodyloops-equa-mp3-player_.swf" width="25" height="16" loop="False" allowscriptaccess="always" allowfullscreen="false" flashvars="filename=samba.mp3&timeplay=0&volume=50&backcolor=#000&maincolor=FFFFFF"> </embed>
</div>

je fais quoi?j'ajoute quoi? et ou??
merciiiii mon ange Joos
0
JooS Messages postés 2468 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
Modifié par JooS le 24/10/2011 à 09:59
Oui je me souviens maintenant, et je me souviens aussi t'avoir dis " mets loop sur true" ...

Mais je suis pas sure, donc ajoute l'attribut loop a la balise embed, et donne lui la valeur true ...
0
salut
nn mais tu sais que je ne maîtrise pas trop, alors ce truc de loop je le met ou?
précise stp?
sur le programme en haut
0
JooS Messages postés 2468 Date d'inscription mardi 22 janvier 2008 Statut Membre Dernière intervention 8 juin 2016 228
25 oct. 2011 à 10:02
<embed src="melodyloops-equa-mp3-player_.swf" width="25" height="16" loop="False" allowscriptaccess="always" loop="true" allowfullscreen="false" flashvars="filename=samba.mp3&timeplay=0&volume=50&backcolor=#000&maincolor=FFFFFF"> </embed> 
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
Modifié par RAD ZONE le 25/10/2011 à 12:41
Salut

voila un code d insertion swf valide W3C et qui passera sans probleme sur tout les navigateurs !

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="25" height="16" id="player">   
      <param name="movie" value="melodyloops-equa-mp3-player_.swf">   
      <param name="loop" value="true">   
      <param name="allowfullscreen" value="false">   
      <param name="allowscriptaccess" value="always">   
      <param name="flashvars" value="filename=samba.mp3&volume=50&maincolor=#FFF&backcolor=#000&timeplay=0">   
      <!--[if !IE]>-->   
      <object type="application/x-shockwave-flash" data="melodyloops-equa-mp3-player_.swf" width="25" height="16">   
        <param name="loop" value="true">   
        <param name="allowfullscreen" value="false">   
        <param name="allowscriptaccess" value="always">   
        <param name="flashvars" value="filename=samba.mp3&volume=50&maincolor=#FFF&backcolor=#000&timeplay=0">   
        <!--<![endif]-->   
        <a href="https://get.adobe.com/flashplayer/">   
          <img src="https://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"></a>    
        <!--[if !IE]>-->   
      </object>    
      <!--<![endif]-->   
    </object>


et voila un petit exemple d info bulle tres simple en css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
  <head>  
    <title>  
      RAD ZONE Webcreation  
    </title>  
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
    <meta name="generator" content="PSPad editor, www.pspad.com" />  
    <style type="text/css">  
/*<![CDATA[*/  
    body {  
      background-color: #464646;  
      font-size: 12px;  
      font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;  
      color: #564b47;  
      text-align: center;  
    }  

    #content {  
      position: absolute;  
      height: 400px;  
      width: 800px;  
      margin: -200px 0px 0px -400px;  
      top: 50%;  
      left: 50%;  
      text-align: left;  
      background-color: #E8FFFF;  
    }  

    p{  
      text-indent: 5px;  
      margin: 5px;  
    }  

    a.infobulle b {  
      display: none;  
    }  

    a.infobulle:hover {  
      position: relative;  
      z-index: 500;  
    }  

    a.infobulle:hover b {  
      display: block;  
      position: absolute;  
      top: 30px;  
      left: 30px;  
      border: 2px;  
      border-color: #000;  
      border-style: dotted;  
      background-color: #7E7E7E;  
      filter: alpha(opacity=70);  
      -moz-opacity: 0.70;  
      opacity: 0.70;  
      text-align: center;  
      color: #F00;  
    }  

    .infobulle2 {  
      color: #30F;  
    }  

    .infobulle2 b {  
      display: none;  
    }  

    .infobulle2:hover { 
      position: relative;  
      z-index: 500;  
    }  

    .infobulle2:hover b {  
      display: block;  
      position: absolute;  
      top: 20px;  
      left: 30px;  
      width: 100px;  
      height: 50px;  
      border: 2px;  
      border-style: dashed;  
      background-color: #7E7E7E;  
      text-align: center;  
      color: #F60;  
      border-color: #000;  
    }  
    /*]]>*/  
    </style>  
  </head>  
  <body>  
    <div id="content">  
      <p>  
        Eu faucibus mauris. <a class="infobulle" href="#">LIEN AVEC infobulle CSS <b>info bulle avec transparence , et  
        taille extensible</b></a> .Lorem ipsum dolor sit amet consectetuer pede lacinia Duis Cum laoreet. Interdum  
        Fusce Curabitur pede aliquet Nulla ut eros condimentum orci porttitor. Nunc.  
      </p>  
      <p>  
        Lorem venenatis id et elit .consectetuer pede lacinia Duis Cum laoreet. <span class="infobulle2">SUR UN TEXTE  
        <b>info bulle opaque , et taille fixe</b></span> Interdum Fusce Curabitur pede aliquet Nulla ut eros  
        condimentum orci porttitor. Nunc.  
      </p>  
    </div>  
  </body>  
</html>  



a+
0