A voir également:
- Pop up javascript
- Serveur pop - Guide
- Telecharger javascript - Télécharger - Langages
- Sketch up - Télécharger - 3D
- Up to box - Guide
- Tune up - Télécharger - Utilitaires
1 réponse
tiralia
Messages postés
1575
Date d'inscription
samedi 14 juin 2008
Statut
Membre
Dernière intervention
9 mars 2016
255
3 sept. 2011 à 03:08
3 sept. 2011 à 03:08
les popup JavaScript sont souvent bloqué sur les navigateurs...
moi j'utilise ceci. a toi d'y intégrer du php, images, js etc...
en espérant t'avoir aidé un petit peu...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>geshi javascript</title>
<script language="Javascript">
// La fonction qui affiche/masque l'élément
pat=1;
patt=1;
function bascule()
{
// Quel est l'état actuel ?
etat=document.getElementById(pat).style.visibility;
document.getElementById(patt).style.visibility="hidden";
if(etat=="hidden"){document.getElementById(pat).style.visibility="visible";patt=pat;}
else{document.getElementById(pat).style.visibility="hidden";patt=pat;}
}
</script>
<style type="text/css">
.infobulle{
position: absolute;
visibility : hidden;
border: 1px solid Black;
padding: 10px;
font-family: Verdana, Arial;
font-size: 10px;
background-color: #FFFFCC;
}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
function GetId(id)
{
return document.getElementById(id);
}
var i=false; // La variable i nous dit si la bulle est visible ou non
function move(e) {
if(i) { // Si la bulle est visible, on calcul en temps reel sa position ideale
if (navigator.appName!="Microsoft Internet Explorer") { // Si on est pas sous IE
GetId("curseur").style.left=e.pageX + 5+"px";
GetId("curseur").style.top=e.pageY + 10+"px";
}
else { // Modif proposé par TeDeum, merci à lui
if(document.documentElement.clientWidth>0) {
GetId("curseur").style.left=20+event.x+document.documentElement.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.documentElement.scrollTop+"px";
} else {
GetId("curseur").style.left=20+event.x+document.body.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.body.scrollTop+"px";
}
}
}
}
function montre(text) {
if(i==false) {
GetId("curseur").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
GetId("curseur").innerHTML = text; // Cette fonction est a améliorer, il parait qu'elle n'est pas valide (mais elle marche)
i=true;
}
}
function cache() {
if(i==true) {
GetId("curseur").style.visibility="hidden"; // Si la bulle etais visible on la cache
i=false;
}
}
document.onmousemove=move; // des que la souris bouge, on appelle la fonction move pour mettre a jour la position de la bulle.
//-->
</script>
<input type="button" onClick="pat=1;bascule();" value="On/Off">
<div name="1" id="1" style="visibility: hidden; position: relative; left: 280px; top: 58px">
<p>oooooooo<img border="0" src="titre.png" width="379" height="64"></div>
<input type="button" onClick="pat=2;bascule();" value="On/Off">
<a href="#" onClick="pat=2;bascule();" onmouseover="montre('VOTRE TEXTE');" onmouseout="cache();">ggggggggggggggggggggggg</a>
<div name="2" id="2" style="visibility: hidden; position: relative; left: 100px; top: 58px">
<p>pppppppp</div>
<p> </p>
moi j'utilise ceci. a toi d'y intégrer du php, images, js etc...
en espérant t'avoir aidé un petit peu...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>geshi javascript</title>
<script language="Javascript">
// La fonction qui affiche/masque l'élément
pat=1;
patt=1;
function bascule()
{
// Quel est l'état actuel ?
etat=document.getElementById(pat).style.visibility;
document.getElementById(patt).style.visibility="hidden";
if(etat=="hidden"){document.getElementById(pat).style.visibility="visible";patt=pat;}
else{document.getElementById(pat).style.visibility="hidden";patt=pat;}
}
</script>
<style type="text/css">
.infobulle{
position: absolute;
visibility : hidden;
border: 1px solid Black;
padding: 10px;
font-family: Verdana, Arial;
font-size: 10px;
background-color: #FFFFCC;
}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
function GetId(id)
{
return document.getElementById(id);
}
var i=false; // La variable i nous dit si la bulle est visible ou non
function move(e) {
if(i) { // Si la bulle est visible, on calcul en temps reel sa position ideale
if (navigator.appName!="Microsoft Internet Explorer") { // Si on est pas sous IE
GetId("curseur").style.left=e.pageX + 5+"px";
GetId("curseur").style.top=e.pageY + 10+"px";
}
else { // Modif proposé par TeDeum, merci à lui
if(document.documentElement.clientWidth>0) {
GetId("curseur").style.left=20+event.x+document.documentElement.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.documentElement.scrollTop+"px";
} else {
GetId("curseur").style.left=20+event.x+document.body.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.body.scrollTop+"px";
}
}
}
}
function montre(text) {
if(i==false) {
GetId("curseur").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
GetId("curseur").innerHTML = text; // Cette fonction est a améliorer, il parait qu'elle n'est pas valide (mais elle marche)
i=true;
}
}
function cache() {
if(i==true) {
GetId("curseur").style.visibility="hidden"; // Si la bulle etais visible on la cache
i=false;
}
}
document.onmousemove=move; // des que la souris bouge, on appelle la fonction move pour mettre a jour la position de la bulle.
//-->
</script>
<input type="button" onClick="pat=1;bascule();" value="On/Off">
<div name="1" id="1" style="visibility: hidden; position: relative; left: 280px; top: 58px">
<p>oooooooo<img border="0" src="titre.png" width="379" height="64"></div>
<input type="button" onClick="pat=2;bascule();" value="On/Off">
<a href="#" onClick="pat=2;bascule();" onmouseover="montre('VOTRE TEXTE');" onmouseout="cache();">ggggggggggggggggggggggg</a>
<div name="2" id="2" style="visibility: hidden; position: relative; left: 100px; top: 58px">
<p>pppppppp</div>
<p> </p>
3 sept. 2011 à 03:09
4 sept. 2011 à 22:08