Discussion:
Question technique
(trop ancien pour répondre)
JV Gruat
2007-09-19 17:25:52 UTC
Permalink
En trafiquant un peu au hasard de
http://www.jvgruat.com/Chine/specificlefs.htm , je me suis dit que ce
serait bien que de pouvoir afficher le pinyin lorsque l'on passe la
souris sur un spécificatif. L'ennui, c'est que la balise "title" est
positionnée sur "lien" et que cette mention est une clef pour le
fonctionnement du javascript permettant la génération de lien.

Quelqu'un(e) aurait-il une idée de comment faire - modifier le
javascript, utiliser autre chose que title, ajouter un 2ème title ?

Merci d'avance !

JVG

PS. Pour Magus - la génération automatique de liens vers Chine-Nouvelle
semble ne plus fonctionner, sur votre site comme sur les miens; j'ai
pour ma part remplacé par Frdic -
("http://www.frdic.com/SearchDic.aspx?word=" +
n.firstChild.nodeValue) ;
Jeannielle
2007-09-20 23:13:07 UTC
Permalink
Bonsoir JVG,

Voici une proposition qui correspond à votre demande, d'après ce que j'ai
compris.

1°) Remplacez la balise meta http-equiv actuelle par celle-ci :
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

2°) Tout en haut de la page, remplacez cette partie :

<style type="text/css">
body {
font-family: arial, helvetica, geneva, sans-serif;
font-size: medium;
}
</style>

par ce qui suit :

<style type="text/css">
body {
font-family: arial, helvetica, geneva, sans-serif;
font-size: medium;
}
.popper {
position : absolute;
visibility : hidden;
}
</style>


3°) Ensuite, juste en dessous de la ligne :

<body style="background-color: transparent; color: rgb(0, 0, 0);"
alink="#ee0000" link="#0000ee" vlink="#551a8b">

Ajoutez ce code :

<DIV ID="topdeck" CLASS="popper"> </DIV>
<SCRIPT>
var strChUserAgent = navigator.userAgent;
var NETSCAPE7 = false;
var strChEnd = strChUserAgent.substring(strChEnd);
if(strChEnd.indexOf("Netscape/7") != -1) { NETSCAPE7 = true; }
var nav = (document.layers);
var iex = (document.getElementById);
if (NETSCAPE7!=true) {var skn = (nav) ? document.topdeck : topdeck.style;}
if (NETSCAPE7==true) {var skn=document.getElementById('topdeck').style;}
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = get_mouse;

function pop(msg,bak) {
if (NETSCAPE7!=true) {
var content ="<TABLE WIDTH=90 BORDER=0 CELLPADDING=2 CELLSPACING=0
BGCOLOR=#000080><TR><TD><TABLE

WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><CENTER><FONT
COLOR=#FFFFFF SIZE=2><B>Pinyin

:</B></FONT></CENTER></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0
CELLPADDING=2 CELLSPACING=0

BGCOLOR="+bak+"><TR><TD><FONT COLOR=#000000

SIZE=2><CENTER>"+msg+"</CENTER></FONT></TD></TR></TABLE></TD></TR></TABLE>";
}
else {
var content ="<TABLE WIDTH=90 BORDER=0 CELLPADDING=2 CELLSPACING=0
BGCOLOR=#000080><TR><TD><TABLE

WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><CENTER><FONT
COLOR=#FFFFFF SIZE=2><B>Pinyin

:</B></FONT></CENTER></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0
CELLPADDING=2 CELLSPACING=0

BGCOLOR="+bak+"><TR><TD><FONT COLOR=#FFFFFF

SIZE=2><CENTER>"+msg+"</CENTER></FONT></TD></TR></TABLE></TD></TR></TABLE>";
}

if (NETSCAPE7==true) {
document.getElementById('topdeck').innerHTML = content;
document.getElementById('topdeck').style.visibility = "visible";
}
if (nav) {
skn.document.write(content);
skn.document.close();
skn.visibility = "visible";
}
if (iex)
{
document.getElementById("topdeck").innerHTML = content;
skn.visibility = "visible";
}
}

function get_mouse(e)
{
if ((iex)&&(navigator.appName.substring(0,3) != "Net")) {
var x = event.x+document.body.scrollLeft;
var y = event.y+document.body.scrollTop; }
if ((iex)&&(navigator.appName.substring(0,3) == "Net")) {
var x = e.pageX ;
var y = e.pageY ; }
skn.left = x -60;
skn.top = y-60;
}

function kill()
{
skn.visibility = "hidden";
}
</SCRIPT>


4°) Enfin, intégrez la transcription en pinyin pour le caractère 八 ba1 en
remplaçant cette partie :

<a title="lien" href="specificlefs.htm#" target="blank">&#20843;</a><span
style="font-weight: bold;"> (huit) est tout sauf &eacute;vident !

par celle-ci :

<a title="lien" href="specificlefs.htm#" target="blank"
onmouseover="pop('bā','FFFF00')"; onmouseout="kill()" ; >&#20843;</a><span
style="font-weight: bold;"> (huit) est tout sauf &eacute;vident !

Une fois que vous savez le faire pour ce caractère, vous pouvez faire de
même pour les autres, en ajoutant
onmouseover="pop('pinyin','FFFF00')"; onmouseout="kill()" ;
à l'intérieur de chacune des balises <a> des caractères concernés.

Voici le détail de la fonction pop() :
pop('pinyin','couleur_de_fond').

Pour chaque caractère remplacez 'pinyin' par la transcription correspondante
entre apostrophes et entrez le code couleur que vous désirez pour la couleur
de fond. également entre apostrophes. Dans l'exemple, j'ai mis 'FFFF00' qui
est le jaune vif, mais vous pouvez choisir n'importe quelle couleur.

Ce code fonctionne (au moins) sur IE7, NS7 et FF2. (Il est à noter que sur
Netscape7, le texte apparaît en blanc sur fond bleu.)

Bien cordialement,

Jeannielle
Post by JV Gruat
En trafiquant un peu au hasard de
http://www.jvgruat.com/Chine/specificlefs.htm , je me suis dit que ce
serait bien que de pouvoir afficher le pinyin lorsque l'on passe la
souris sur un spécificatif. L'ennui, c'est que la balise "title" est
positionnée sur "lien" et que cette mention est une clef pour le
fonctionnement du javascript permettant la génération de lien.
Quelqu'un(e) aurait-il une idée de comment faire - modifier le
javascript, utiliser autre chose que title, ajouter un 2ème title ?
Merci d'avance !
JVG
Jeannielle
2007-09-21 21:17:09 UTC
Permalink
Je viens de repasser voir la page et j'ai constaté que vous avez utilisé la
version originale du code que j'avais modifié hier pour le rendre compatible
avec Netscape 7... C'est dommage, j'étais assez contente du résultat !

Bien cordialement,

Jeannielle
Post by Jeannielle
Bonsoir JVG,
Voici une proposition qui correspond à votre demande, d'après ce que j'ai
compris.
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
body {
font-family: arial, helvetica, geneva, sans-serif;
font-size: medium;
}
</style>
<style type="text/css">
body {
font-family: arial, helvetica, geneva, sans-serif;
font-size: medium;
}
.popper {
position : absolute;
visibility : hidden;
}
</style>
<body style="background-color: transparent; color: rgb(0, 0, 0);"
alink="#ee0000" link="#0000ee" vlink="#551a8b">
<DIV ID="topdeck" CLASS="popper"> </DIV>
<SCRIPT>
var strChUserAgent = navigator.userAgent;
var NETSCAPE7 = false;
var strChEnd = strChUserAgent.substring(strChEnd);
if(strChEnd.indexOf("Netscape/7") != -1) { NETSCAPE7 = true; }
var nav = (document.layers);
var iex = (document.getElementById);
if (NETSCAPE7!=true) {var skn = (nav) ? document.topdeck : topdeck.style;}
if (NETSCAPE7==true) {var skn=document.getElementById('topdeck').style;}
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = get_mouse;
function pop(msg,bak) {
if (NETSCAPE7!=true) {
var content ="<TABLE WIDTH=90 BORDER=0 CELLPADDING=2 CELLSPACING=0
BGCOLOR=#000080><TR><TD><TABLE
WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><CENTER><FONT
COLOR=#FFFFFF SIZE=2><B>Pinyin
:</B></FONT></CENTER></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0
CELLPADDING=2 CELLSPACING=0
BGCOLOR="+bak+"><TR><TD><FONT COLOR=#000000
SIZE=2><CENTER>"+msg+"</CENTER></FONT></TD></TR></TABLE></TD></TR></TABLE>";
}
else {
var content ="<TABLE WIDTH=90 BORDER=0 CELLPADDING=2 CELLSPACING=0
BGCOLOR=#000080><TR><TD><TABLE
WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><CENTER><FONT
COLOR=#FFFFFF SIZE=2><B>Pinyin
:</B></FONT></CENTER></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0
CELLPADDING=2 CELLSPACING=0
BGCOLOR="+bak+"><TR><TD><FONT COLOR=#FFFFFF
SIZE=2><CENTER>"+msg+"</CENTER></FONT></TD></TR></TABLE></TD></TR></TABLE>";
}
if (NETSCAPE7==true) {
document.getElementById('topdeck').innerHTML = content;
document.getElementById('topdeck').style.visibility = "visible";
}
if (nav) {
skn.document.write(content);
skn.document.close();
skn.visibility = "visible";
}
if (iex)
{
document.getElementById("topdeck").innerHTML = content;
skn.visibility = "visible";
}
}
function get_mouse(e)
{
if ((iex)&&(navigator.appName.substring(0,3) != "Net")) {
var x = event.x+document.body.scrollLeft;
var y = event.y+document.body.scrollTop; }
if ((iex)&&(navigator.appName.substring(0,3) == "Net")) {
var x = e.pageX ;
var y = e.pageY ; }
skn.left = x -60;
skn.top = y-60;
}
function kill()
{
skn.visibility = "hidden";
}
</SCRIPT>
4°) Enfin, intégrez la transcription en pinyin pour le caractère 八 ba1 en
<a title="lien" href="specificlefs.htm#" target="blank">&#20843;</a><span
style="font-weight: bold;"> (huit) est tout sauf &eacute;vident !
<a title="lien" href="specificlefs.htm#" target="blank"
onmouseover="pop('bā','FFFF00')"; onmouseout="kill()" ; >&#20843;</a><span
style="font-weight: bold;"> (huit) est tout sauf &eacute;vident !
Une fois que vous savez le faire pour ce caractère, vous pouvez faire de
même pour les autres, en ajoutant
onmouseover="pop('pinyin','FFFF00')"; onmouseout="kill()" ;
à l'intérieur de chacune des balises <a> des caractères concernés.
pop('pinyin','couleur_de_fond').
Pour chaque caractère remplacez 'pinyin' par la transcription
correspondante entre apostrophes et entrez le code couleur que vous
désirez pour la couleur de fond. également entre apostrophes. Dans
l'exemple, j'ai mis 'FFFF00' qui est le jaune vif, mais vous pouvez
choisir n'importe quelle couleur.
Ce code fonctionne (au moins) sur IE7, NS7 et FF2. (Il est à noter que sur
Netscape7, le texte apparaît en blanc sur fond bleu.)
Bien cordialement,
Jeannielle
Post by JV Gruat
En trafiquant un peu au hasard de
http://www.jvgruat.com/Chine/specificlefs.htm , je me suis dit que ce
serait bien que de pouvoir afficher le pinyin lorsque l'on passe la
souris sur un spécificatif. L'ennui, c'est que la balise "title" est
positionnée sur "lien" et que cette mention est une clef pour le
fonctionnement du javascript permettant la génération de lien.
Quelqu'un(e) aurait-il une idée de comment faire - modifier le
javascript, utiliser autre chose que title, ajouter un 2ème title ?
Merci d'avance !
JVG
JV Gruat
2007-09-22 00:58:47 UTC
Permalink
Post by Jeannielle
Je viens de repasser voir la page et j'ai constaté que vous avez
utilisé la version originale du code que j'avais modifié hier pour
le rendre compatible avec Netscape 7... C'est dommage, j'étais assez
contente du résultat !
Comme mentionné plus haut, le problème c'est que le code fourni
apparemment ne fonctionnait pas ... Je ne sais pas ce qui cloche, ceci
dit. Et suis bien incapable de m'en dépétrer !

Si vous avez une idée, je suis bien entendu preneur - le plus long,
c'est-à-dire le contenu des pop up, reste le même, donc rien
d'intangible.

Merci encore !

JVG
Jeannielle
2007-09-22 07:30:36 UTC
Permalink
Bonjour,

Je suis ravie que le principe vous ait plu et désolée que vous n'ayez pas pu
voir le script fonctionner du premier coup : ce n'est en fait qu'un problème
de copier-coller qui tronque certaines lignes...

Pour remédier à cet inconvénient, je vous propose de récupérer le fichier
fonctionnel directement à cette adresse : http://katinka.free.fr/pourJVG/

Non seulement j'avais ajouté la comptabilité avec Netscape 7 mais aussi avec
FireFox ; j'espère qu'un maximum de vos visiteurs pourront ainsi apprécier
le contenu de ces petites bulles d'info fort utiles.

Bien cordialement,

Jeannielle
Post by JV Gruat
Post by Jeannielle
Je viens de repasser voir la page et j'ai constaté que vous avez
utilisé la version originale du code que j'avais modifié hier pour
le rendre compatible avec Netscape 7... C'est dommage, j'étais assez
contente du résultat !
Comme mentionné plus haut, le problème c'est que le code fourni
apparemment ne fonctionnait pas ... Je ne sais pas ce qui cloche, ceci
dit. Et suis bien incapable de m'en dépétrer !
Si vous avez une idée, je suis bien entendu preneur - le plus long,
c'est-à-dire le contenu des pop up, reste le même, donc rien
d'intangible.
Merci encore !
JVG
JV Gruat
2007-09-22 18:52:40 UTC
Permalink
Post by Jeannielle
Pour remédier à cet inconvénient, je vous propose de récupérer le
C'est fait - merci beaucoup pour tout ce mal que vous vous êtes donné !

Je suis sûr qu'il y en aura bien quelqu'un ou une à qui cela sera utile
... mois le premier.
--
Jean-Victor Gruat
http://jvgruat.free.fr/Chine/specificlefs.htm
Jeannielle
2007-09-23 10:07:46 UTC
Permalink
不用谢 bu4yong4 xie4 ; cela m'a donné l'occasion de réviser voire, pour
certains, de redécouvrir ces spécificatifs et c'est vraiment utile !
Merci à vous, donc, pour cette page.

Bien cordialement,

Jeannielle
Post by JV Gruat
Post by Jeannielle
Pour remédier à cet inconvénient, je vous propose de récupérer le
C'est fait - merci beaucoup pour tout ce mal que vous vous êtes donné !
Je suis sûr qu'il y en aura bien quelqu'un ou une à qui cela sera utile
... mois le premier.
--
Jean-Victor Gruat
http://jvgruat.free.fr/Chine/specificlefs.htm
JV Gruat
2007-09-22 00:01:53 UTC
Permalink
Post by Jeannielle
Bonsoir JVG,
Voici une proposition qui correspond à votre demande, d'après ce que
j'ai compris.
Merci infiniment - c'est exactement ce que je souhaitais ...

A ceci près cependant que, la partie substantielle du script ne
foncitonnant pas, je suis allé picorer sur la toile quelque chose
d'approchant dont je ne sait s'il fonctionne en dehors d'Internet
Explorer.

Le plus long, évident, ça a été d'introduire la prononciation - je me
suis d'ailleurs limité aux spécificatifs dans la colonne partie droite
du tableau.

Résultat sur http://www.jvgruat.com/Chine/specificlefs.htm ou son
équivalent par jvgruat.free.fr ...

Merci encore !

JVG
Eric Lafontaine
2007-09-23 10:57:19 UTC
Permalink
Post by JV Gruat
En trafiquant un peu au hasard de
http://www.jvgruat.com/Chine/specificlefs.htm , je me suis dit que ce
serait bien que de pouvoir afficher le pinyin lorsque l'on passe la
souris sur un spécificatif. L'ennui, c'est que la balise "title" est
positionnée sur "lien" et que cette mention est une clef pour le
fonctionnement du javascript permettant la génération de lien.
Quelqu'un(e) aurait-il une idée de comment faire - modifier le
javascript, utiliser autre chose que title, ajouter un 2ème title ?
Merci d'avance !
JVG
PS. Pour Magus - la génération automatique de liens vers Chine-Nouvelle
semble ne plus fonctionner, sur votre site comme sur les miens; j'ai
pour ma part remplacé par Frdic -
("http://www.frdic.com/SearchDic.aspx?word=" +
n.firstChild.nodeValue) ;
Si je peux me permettre une petite remarque...
Autant j'apprécie le système d'annotation (Javascript comme dans ce
cas-ci, ou Ruby) pour des phrases ou des textes (dans le style de ce que
fait www.rikai.com, entre autres), autant je trouve que, dans ce cas
précis, il serait bien plus agréable de disposer d'une colonne
supplémentaire donnant le pinyin sans qu'il soit besoin de tirer la
souris par la queue.

Quoi qu'il en soit, comme toujours un grand merci pour la qualité du site.
--
Eric Lafontaine
http://ventre-a-pattes.com
JV Gruat
2007-09-23 15:23:44 UTC
Permalink
Le soussigné a cru pouvoir répondre à Eric Lafontaine
Post by Eric Lafontaine
Si je peux me permettre une petite remarque...
cas précis, il serait bien plus agréable de disposer d'une colonne
supplémentaire donnant le pinyin sans qu'il soit besoin de tirer la
souris par la queue.
Suis pas sûr ... J'ai l'impression que la présence systématique du
pinyin incite à la paresse intellectuelle - pas d'effort pour mémoriser.
Par ailleurs, et dans ce cas précis, il y a une question de mise en
page. Plus le fait que, lorsque j'ai conçu la page, je n'avais pas en
tête de mettre de transcription phonétique du tout !
Post by Eric Lafontaine
Quoi qu'il en soit, comme toujours un grand merci pour la qualité du
site. --
Merci à vous de le dire et de consulter ...

JVG

Continuer la lecture sur narkive:
Loading...