begin process at 2010 03 20 22:57:32
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Navigation

 > INFOBULLE SOUS IE ET/OU NETSCAPE

INFOBULLE SOUS IE ET/OU NETSCAPE


 Information sur la source

Note :
6 / 10 - par 2 personnes
6,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Navigation Niveau :Débutant Date de création :09/05/2002 Date de mise à jour :09/05/2002 23:04:47 Vu :20 112

Auteur : pi0up51

Ecrire un message privé
Site perso
Commentaire sur cette source (1)
Ajouter un commentaire et/ou une note

 Description

Voilà comment faire des infobulle dans vos page que ce soit avec IE ou NE ;)

Sous IE rien de plus simple :
<A href="lien.html" title="Retour &agrave la Liste des Applications">

Sous NE on est obligé de passer par le DHTML et les calques ;)

Source

  • <html>
  • <title>Info-bulle sous NETSCAPE ..DHTML</TITLE>
  • <script language=JavaScript><!--
  • var tim,calk, nav="IE";
  • function init()
  • {
  • if (navigator.appName=="Netscape")
  • nav="NE" ;
  • }
  • function vol_out()
  • {if (nav=="NE")
  • calk.visibility="hide"; clearTimeout(tim);
  • }
  • function vol_over(n,texte)
  • {
  • if (nav=="NE")
  • {
  • calk=document.layers['bulle'];
  • calk.document.open();
  • calk.document.bgColor='#ffffdd';
  • calk.document.write(
  • '<font face="Verdana,Arial" size=1>'+texte+'</FONT>');
  • calk.document.close();
  • calk.top=document.links[n].y+20;
  • calk.left=document.links[n].x+50;
  • setTimeout('calk.visibility="show"',1000);
  • tim=setTimeout('calk.visibility="hide"',10000);
  • }
  • }
  • //-->
  • </script>
  • <body bgcolor="#eeeeee" onLOad="init()">
  • <br><font face="Verdana,Arial" size=-2 color=blue>
  • Script permettant de créer la fonctionnalité <font color=red>
  • <b>Info-bulle</B></font> sous Netscape.<br><br>
  • <I><font color="black">Sachant que sous IExplorer elle peut être mise en service grâce à l'attribut TITLE de la balise de Lien ..de la manière suivante :<br>
  • &lt;A href="pageA.htm" title="Lancement de la page A.."></I>
  • </font></font>
  • <PRE>
  • <a href="#" onMouseover="vol_over(0,'Voici le 1er Lien sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 1">LIEN 1</A>
  • <br><br>
  • <a href="#" onMouseover="vol_over(1,'Le second Lien est ici sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 2">LIEN 2</a><br><br>
  • <a href="#" onMouseover="vol_over(2,'Voici le 3ème Lien de cette Page sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 1">LIEN 3</a><br><br>
  • </PRE>
  • <div id="bulle" style="position:absolute;left:0;top:0;backgroud-color:oldlace;width:100">
  • </div>
  • <br><BR>
  • <div align=center>
  • <font face="Verdana,Arial" size=-2>
  • <A href="applications_jvs.html#dhtml" onMouseover="vol_over(3,'Pour Revenir &agrave; la Liste des Applications..')" onMouseout="vol_out()" title="Retour &agrave la Liste des Applications">
  • <br>
  • </div>
  • </body>
  • </html>
<html>
<title>Info-bulle sous NETSCAPE ..DHTML</TITLE>
<script language=JavaScript><!--
var tim,calk, nav="IE";
function init()
{
 if (navigator.appName=="Netscape")
  nav="NE" ;
}

function vol_out()
{if (nav=="NE")
 calk.visibility="hide"; clearTimeout(tim);
}
function vol_over(n,texte)
{
 if (nav=="NE")
 {
 calk=document.layers['bulle'];
 calk.document.open();
 calk.document.bgColor='#ffffdd';
 calk.document.write(
     '<font face="Verdana,Arial" size=1>'+texte+'</FONT>');
 calk.document.close();
 calk.top=document.links[n].y+20;
 calk.left=document.links[n].x+50;
 setTimeout('calk.visibility="show"',1000);
 tim=setTimeout('calk.visibility="hide"',10000);
 }
}
//-->
</script>
<body bgcolor="#eeeeee" onLOad="init()">
<br><font face="Verdana,Arial" size=-2 color=blue>
Script permettant de créer la fonctionnalité <font color=red>
<b>Info-bulle</B></font> sous Netscape.<br><br>
<I><font color="black">Sachant que sous IExplorer elle peut être mise en service grâce à l'attribut TITLE de la balise de Lien ..de la manière suivante :<br>
&lt;A href="pageA.htm" title="Lancement de la page A.."></I>
</font></font>

<PRE>
	<a href="#" onMouseover="vol_over(0,'Voici le 1er Lien sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 1">LIEN 1</A>
<br><br>
		<a href="#" onMouseover="vol_over(1,'Le second Lien est ici sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 2">LIEN 2</a><br><br>
			<a href="#" onMouseover="vol_over(2,'Voici le 3ème Lien de cette Page sous Netscape')" onMouseout="vol_out()" title="sous IExplorer ..Lien 1">LIEN 3</a><br><br>
</PRE>
<div id="bulle" style="position:absolute;left:0;top:0;backgroud-color:oldlace;width:100">
</div> 
<br><BR>
<div align=center>
<font face="Verdana,Arial" size=-2>
<A href="applications_jvs.html#dhtml" onMouseover="vol_over(3,'Pour Revenir &agrave; la Liste des Applications..')" onMouseout="vol_out()" title="Retour &agrave la Liste des Applications">
<br>
</div>
</body>
</html> 

 Conclusion

Vélà regarder bien cette source c facile ;)
J'espère qu'elle vous servira

@tte et bonn' prog'
pi0up51
http://www.infobox51.fr.st


 Sources du même auteur

EVENT HANDLER (INFO-AIDE FORMULAIRE + QQS FONCTIONS)
FRACTALE MANDLEBROT (GÉNÉRER EN JS AVEC BOUCLE FOR..)
POPUP QUI AFFICHE LE TEMPS DE CONNECTION SUR UNE PAGE ;)
DESSINER UN HISTOGRAMME (DYNAMIQUEMENT ! :)
Source avec Zip IMAGES RÉACTIVE !!

 Sources de la même categorie

Source avec Zip EMULATION DE $_GET() DU PHP par jchan
Source avec Zip ACCESSIBARRE - AMÉLIORER LE CONFORT DES PERSONNES NON-VOYANT... par Pfuch
Source avec Zip CLASS BARRE DE DÉFILEMENT (SCROLLBAR) JAVASCRIPT par TheWeasel47
Source avec une capture TAILLEFONTE par tiger222
Source avec Zip Source avec une capture MOTEUR DE RECHERCHE SANS PHP par jdmcreator

Commentaires et avis

Commentaire de freezeciv le 27/05/2008 18:39:53

Bonjour,
J'ai une info bulle relativement longue à écrire et donc à lire.
Je souhaite utiliser la fonction title pour le faire mais malheureusement aprés qq secondes d'affichage, l'info bulle disparait. Est-il possible de configurer le temps d'affichage pour donner plus de temps au lecteur?

 Ajouter un commentaire




Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,669 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales