CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 05 28 07:37:43

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

AFFICHER UN POPUP DE DÉFINITION

Information sur la source

Note :

10,00 / 10

Catégorie :Fenêtre & Pop-up Niveau :Débutant Date de création :17/02/2003 Date de mise à jour :19/02/2003 01:55:12 Vu :14 858

Auteur : McPeter

Ecrire un message privé

Site perso

Commentaire sur cette source (5)

Ajouter un commentaire et/ou une note

Description

Afficher un PopUp de définition pour un mot dansune liste déroulante
Avec paramêtrage du popup

c'est tout bête mais ça peut servir :)

Voir l'effet ici => http://www.blinckers-groups.com/script/changement_ list_popup.html

Marche sous IE et N6

@++

Source

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!--
***************************************************
* PopUp sur liste ver 1.2
***************************************************
* Script pour afficher une définition dans un
* PopUp sur le changement d'un éléments d'une
* liste déroulante.
* Distribution libre
* BLINCKERS© Groups by McPeter
* http://www.blinckers-groups.com
* mcpeter@blinckers-groups.com
***************************************************
-->
<html>
<head>
<title>Définition sur liste</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.case {
margin: 4px;
padding: 4px;
width: 500px;
font-size: 12px;
border: 1px dashed #666666;
}
-->
</style>
</head>
<body>
<table width="500" border="0" align="center" cellpadding="0" cellspacing="4" bgcolor="#E5E5E5" class="case">
<tr>
<td>
<span style="font-size: 12px">
<em><font color="#333333"><strong>BLINCKERS© Groups by McPeter | Section JavaScript</strong></font></em><br> <br>
<font color="#004E98">Script pour afficher une définition, ou toutes données<br>
voulues, en fonction d'un choix dans une liste déroulante.</font>
<hr></span>
<form name="liste">
<table width="100%" border="0" cellpadding="2" cellspacing="0">
<tr>
<td width="140" align="left" valign="top">
<select name="liste_de_mots" style="width: 135px; font-size: 12px; color:#004E98" onChange="javascript:afficher_definition(document.liste.liste_de_mots.options[form.liste_de_mots.selectedIndex].value)">
<option value="0">--- Choisissez un mot ---</option>
<option value="0">------------------------------------</option>
<option value="1">Broadcast</option>
<option value="2">Chat</option>
<option value="3">Cookies</option>
<option value="4">DL</option>
<option value="5">E-Mail</option>
<option value="6">HTML</option>
</select></td>
<td><span style="font-size: 12px; color:#004E98">Choisisser un mot dans la liste déroulante pour voir sa définition</span></td>
</tr>
</table>
</form>
<script language="JavaScript 1.2" type="text/JavaScript">
// Paramêtre du PopUp
var couleur_de_fond_0 = "#E5E5E5";
var largeur_fenetre = "400"; // valeur en pixels
var hauteur_fenetre = "300"; // valeur en pixels
// Paramêtre de la zone de Titre
var couleur_titre = "#FF0000";
var police_titre = "Verdana";
var taille_titre = "12px";
var couleur_de_fond_1 = "#9BB6DA";
// Paramêtres pour la zone de définition
var couleur_content = "#333333";
var police_content = "Verdana";
var taille_content = "12px";
var couleur_de_fond_2 = "#9BB6DA";
// Paramêtres pour la zone de pied de PopUp
var couleur_pied = "#333333";
var police_pied = "Verdana";
var taille_pied = "12px";
var couleur_de_fond_3 = "#9BB6DA";
// Paramètres pour le bouton fermer
var fond_bouton = "#E5E5E5";
var police_bouton = "Verdana";
var taille_text_bouton = "10px";
var color_text_bouton = "#333333";
content=new Array();
// Modifiez le tableau ci-dessous pour y inscrire le texte associé à vos définitions.
// Vous pouvez augmenter ou réduire ce tableau à volonté.
// Le premier termes mis dans les apostrophes, est pour le titre, le deuxième : la définition.
content[0]=new Array("Définitions","Choisisser un mot dans la liste déroulante pour voir sa définition");
content[1]=new Array("Broadcast","Envoyer un message à l\'ensemble des membres de la liste");
content[2]=new Array("Chat","Vient de \"to chat\" : Discuter.");
content[3]=new Array('Cookies','Fichier téléchargé sur votre ordinateur lors d\'une navigation pour automatiser certaines tâches, comme la reconnaissance d\'un login et d\'un mot de passe.');
content[4]=new Array('DL','En anglais : DownLoad<br>Télécharger un fichier d\'un réseau/ordinateur vers son ordinateur');
content[5]=new Array('E-Mail','En anglais : Electronique Mail<br>Boîte aux lettres électronique.');
content[6]=new Array('HTML','En anglais : HyperText Mark-up Language<br>Langage universel permettant la mise en forme de texte.');
function afficher_definition(mot)
{
Window2=open("","","scrollbars=no,width="+largeur_fenetre+",height="+hauteur_fenetre+"");
Window2.document.open();
Window2.document.write("<html><head><TITLE>BLINCKERS© Groups - Définition sur liste</TITLE></head>");
Window2.document.write("<body bgcolor="+couleur_de_fond_0+" text=#000000>");
Window2.document.write("<table width=100% border=0 cellspacing=2 cellpadding=2><tr>");
Window2.document.write("<td height=30 align=center valign=middle bgcolor="+couleur_de_fond_1+" style='border: 1px dashed #333333; font-size:"+taille_titre+"; color:"+couleur_titre+"'>")
Window2.document.write("<strong>"+content[mot][0]+"</strong>");
Window2.document.write("</td></tr></table><br>");
Window2.document.write("<table width=100% height=62% border=0 cellspacing=2 cellpadding=5><tr>");
Window2.document.write("<td align=left valign=top bgcolor="+couleur_de_fond_2+" style='border: 1px dashed #333333; font-size:"+taille_content+"; color:"+couleur_content+"'>");
Window2.document.write(content[mot][1]);
Window2.document.write("</td></tr></table><br>");
Window2.document.write("<table width=100% border=0 cellspacing=2 cellpadding=2><tr>");
Window2.document.write("<td height=30 align=center valign=middle bgcolor="+couleur_de_fond_3+" style='border: 1px dashed #333333; font-size:"+taille_pied+"; color:"+couleur_pied+"'>");
Window2.document.write("<input type=button value='Fermer la fenêtre' onclick='window.close()' style='background-color:"+fond_bouton+" ; background-attachment: scroll; font-family:"+police_bouton+" ; font-size:"+taille_text_bouton+" ; color:"+color_text_bouton+" ; border-height: 2; text-decoration: none; font-weight: bold; border: 1; border-style: solid; padding: 1'>");
Window2.document.write("</td></tr></table></body></html>");
Window2.document.close();
}
</script>
</td>
</tr>
</table>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- 
***************************************************
* PopUp sur liste ver 1.2
***************************************************
* Script pour afficher une définition dans un
* PopUp sur le changement d'un éléments d'une 
* liste déroulante.
* Distribution libre
* BLINCKERS© Groups by McPeter
* http://www.blinckers-groups.com
* mcpeter@blinckers-groups.com
***************************************************
-->
<html>
<head>
<title>Définition sur liste</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.case {
margin: 4px;
padding: 4px;
width: 500px;
font-size: 12px;
border: 1px dashed #666666;
}
-->
</style>
</head> 
<body>
<table width="500" border="0" align="center" cellpadding="0" cellspacing="4" bgcolor="#E5E5E5" class="case">
<tr> 
<td>
<span style="font-size: 12px">
<em><font color="#333333"><strong>BLINCKERS© Groups by McPeter | Section JavaScript</strong></font></em><br> <br>
<font color="#004E98">Script pour afficher une définition, ou toutes données<br>
voulues, en fonction d'un choix dans une liste déroulante.</font>
<hr></span>
<form name="liste">
<table width="100%" border="0" cellpadding="2" cellspacing="0">
<tr> 
<td width="140" align="left" valign="top">
<select name="liste_de_mots" style="width: 135px; font-size: 12px; color:#004E98" onChange="javascript:afficher_definition(document.liste.liste_de_mots.options[form.liste_de_mots.selectedIndex].value)">
<option value="0">--- Choisissez un mot ---</option>
<option value="0">------------------------------------</option>
<option value="1">Broadcast</option>
<option value="2">Chat</option>
<option value="3">Cookies</option>
<option value="4">DL</option>
<option value="5">E-Mail</option>
<option value="6">HTML</option>
</select></td>
<td><span style="font-size: 12px; color:#004E98">Choisisser un mot dans la liste déroulante pour voir sa définition</span></td>
</tr>
</table>
</form>
<script language="JavaScript 1.2" type="text/JavaScript">
// Paramêtre du PopUp
var couleur_de_fond_0 = "#E5E5E5";
var largeur_fenetre = "400"; // valeur en pixels
var hauteur_fenetre = "300"; // valeur en pixels
// Paramêtre de la zone de Titre
var couleur_titre = "#FF0000";
var police_titre = "Verdana";
var taille_titre = "12px";
var couleur_de_fond_1 = "#9BB6DA";
// Paramêtres pour la zone de définition
var couleur_content = "#333333";
var police_content = "Verdana";
var taille_content = "12px";
var couleur_de_fond_2 = "#9BB6DA";
// Paramêtres pour la zone de pied de PopUp
var couleur_pied = "#333333";
var police_pied = "Verdana";
var taille_pied = "12px";
var couleur_de_fond_3 = "#9BB6DA";
// Paramètres pour le bouton fermer
var fond_bouton = "#E5E5E5";
var police_bouton = "Verdana";
var taille_text_bouton = "10px";
var color_text_bouton = "#333333";

content=new Array();
// Modifiez le tableau ci-dessous pour y inscrire le texte associé à vos définitions.
// Vous pouvez augmenter ou réduire ce tableau à volonté.
// Le premier termes mis dans les apostrophes, est pour le titre, le deuxième : la définition.
content[0]=new Array("Définitions","Choisisser un mot dans la liste déroulante pour voir sa définition");
content[1]=new Array("Broadcast","Envoyer un message à l\'ensemble des membres de la liste");
content[2]=new Array("Chat","Vient de \"to chat\" : Discuter.");
content[3]=new Array('Cookies','Fichier téléchargé sur votre ordinateur lors d\'une navigation pour automatiser certaines tâches, comme la reconnaissance d\'un login et d\'un mot de passe.');
content[4]=new Array('DL','En anglais : DownLoad<br>Télécharger un fichier d\'un réseau/ordinateur vers son ordinateur');
content[5]=new Array('E-Mail','En anglais : Electronique Mail<br>Boîte aux lettres électronique.');
content[6]=new Array('HTML','En anglais : HyperText Mark-up Language<br>Langage universel permettant la mise en forme de texte.');

function afficher_definition(mot)
{
Window2=open("","","scrollbars=no,width="+largeur_fenetre+",height="+hauteur_fenetre+"");
Window2.document.open();
Window2.document.write("<html><head><TITLE>BLINCKERS© Groups - Définition sur liste</TITLE></head>");
Window2.document.write("<body bgcolor="+couleur_de_fond_0+" text=#000000>");
Window2.document.write("<table width=100% border=0 cellspacing=2 cellpadding=2><tr>");
Window2.document.write("<td height=30 align=center valign=middle bgcolor="+couleur_de_fond_1+" style='border: 1px dashed #333333; font-size:"+taille_titre+"; color:"+couleur_titre+"'>")
Window2.document.write("<strong>"+content[mot][0]+"</strong>");
Window2.document.write("</td></tr></table><br>");
Window2.document.write("<table width=100% height=62% border=0 cellspacing=2 cellpadding=5><tr>");
Window2.document.write("<td align=left valign=top bgcolor="+couleur_de_fond_2+" style='border: 1px dashed #333333; font-size:"+taille_content+"; color:"+couleur_content+"'>");
Window2.document.write(content[mot][1]);
Window2.document.write("</td></tr></table><br>");
Window2.document.write("<table width=100% border=0 cellspacing=2 cellpadding=2><tr>");
Window2.document.write("<td height=30 align=center valign=middle bgcolor="+couleur_de_fond_3+" style='border: 1px dashed #333333; font-size:"+taille_pied+"; color:"+couleur_pied+"'>");
Window2.document.write("<input type=button value='Fermer la fenêtre' onclick='window.close()' style='background-color:"+fond_bouton+" ; background-attachment: scroll; font-family:"+police_bouton+" ; font-size:"+taille_text_bouton+" ; color:"+color_text_bouton+" ; border-height: 2; text-decoration: none; font-weight: bold; border: 1; border-style: solid; padding: 1'>");
Window2.document.write("</td></tr></table></body></html>");
Window2.document.close();
}
</script>
</td>
</tr>
</table>
</body>
</html>

Conclusion

*************
* Mise à jour
*************
19/02/2003

Réctification du code pour compatibilité Netscape 6

Sources du même auteur

INFO BULLE NON DESTRUCTIVE

RÉCUPÉRER TOUTES LES VALEURS D'UN SELECT MULTIPLE DANS UNE V...

AJUSTER DES IMAGES À LA DÉFINITION DE L'ÉCRAN DANS UNE NOUVE...

Toutes les sources de McPeter

Sources de la même categorie

MYNOTIFICATIONS par inwebo

POSMOUSE - AFFICHAGE DES COORDONNÉES DE LA SOURIS, TAILLE DE... par phidelum

SFR WIDGET ET JQUERY par hhoareau

JOLIE ALERTE AVEC "ALERT()" par heycraft

FENETRE D'ACTUALITE par kazma

Toutes les sources de la catégorie Fenêtre & Pop-up

Commentaires et avis

Commentaire de ronanry le 18/02/2003 10:05:28

en fait c tout con ton pb de pourquoi ca marche pas....
sous netscape, c un petit peu plus "strict" que sous IE
faut que tu respecte le dom netscape....
c a dire : nommer ton formulaire : <form name=lol>
et ensuite que sur ton onChange tu ecrive : onChange="afficher_definition(document.lol.liste_de_mots.options.value)
je te conseille egalement de plutot crire ceci :
onChange="javascript:afficher_definition(document.lol.liste_de_mots.options.value)
(c 'est plus propre :))

Commentaire de McPeter le 19/02/2003 02:00:51

Salut !
Ca c'est du commentaire constructif ! :-)
Merci ronanry

en fait ça allait même plus loin ...
j'ai dû modifier davantage la déclaration pour onChange

=> onChange="javascript:afficher_definition(document.liste.liste_de_mots.options[form.liste_de_mots.selectedIndex].value)"

apparement sous N6, il n'était pas capable de lire la valeur ("mot") avec seulement le "...liste_de_mots.options.value.." il fallait que je précise plutôt la valeur indexée
=> "...liste_de_mots.options[form.liste_de_mots.selectedIndex].value..."

Testé sous IE6 et N6 tout à l'air de fonctionner correctement ...
J'ai dû également spécifié une valeur pour la hauteur du popUp car apparement Netscape a besoin d'une valeur (sans, on voyait pas le bas du contenu du popUp)

donc si d'autres aussi bon avis .. ?
je suis preneur . :-)

@++

Commentaire de kegi le 25/11/2003 14:06:31

regarde tu vois tes pas mieux que personne.mc peter sur tous tes scripts...KeGi

Commentaire de McPeter le 15/09/2004 22:35:00

le commentaire est tellement à deux balles que je l'avais pas vu :))
lol
t'auras un sucre kegi

Commentaire de cantin le 13/05/2005 14:31:31

J'ai installer ce code ça marche tres bien .
je suis débutant je voudrais savoir avec qui va reconnaitre ce code
IE , netscape ?????
merci de me repondre.

Ajouter un commentaire

Nos sponsors

Derniers Blogs

IMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg

KINECT 1.5 IS OUT ! par Vko

LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc

REACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITER par Groc

SHAREPOINT BLOG SITE, PROBLèME D'ARCHIVES par junarnoalg

Forum

RE : CODE POUR FAIRE APPARAîTRE UN TEXTE EN DESSOUS D'UN LIEN par emuleed2k

RE : RéCUPERATION D'UNE VARIABLE DE JAVASCRIPT VIA PHP par smahaneAAI

POPUP OUVERT à PARTIR D'UN IFRAME par mrassaa

UTILISER UN .JS par zaikoe

RE : CODE BUG JAVASCRIPT par zaikoe

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Realisation d-une version 2 d-un site e-commerce existant sous prestashop-REPUBLICATION
Budget : 5 000€
Recherche Infogerance Serveur Debian Linux
Budget : 1 800€
Creation d-un site vitrine avec MagentO
Budget : 2 000€

Logiciels

sDEVIS-FACTURES vlPRO (8.1.0.3)
SDEVIS-FACTURES VLPRO (8.1.0.3)

sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa...

Cliquez pour télécharger sDEVIS-FACTURES vlPRO
974 Application Server (12.2.4.6)
974 APPLICATION SERVER (12.2.4.6)

Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc...

Cliquez pour télécharger 974 Application Server
vPicture (1.4.2.1)
VPICTURE (1.4.2.1)

Avec vPicture, hébergez vos images facilement et rapidement. vPicture est un utilitaire simple, ...

Cliquez pour télécharger vPicture
Easy-Planning (2.2.1.6)
EASY-PLANNING (2.2.1.6)

Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au...

Cliquez pour télécharger Easy-Planning
COM-BACKUP (2.0)
COM-BACKUP (2.0)

COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...

Cliquez pour télécharger COM-BACKUP