Infobulle sous ie et/ou netscape

Contenu du snippet

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 à la Liste des Applications">

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

Source / Exemple :


<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>
<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 à 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

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.