Salut et merci,
oui, c est effectivement une solution interessante, l'a l'avantage de
s'effectuer cote client, ton script fonctionne sur ie >=5, netscape >=6, et
meme opera 6... Par contre la propriété 'getElementById' est assez recente me
semble t il, elle doit pas trop fonctionner sur les navigateurs anciens ou
iconoclastes...
Vais quand meme certainement utiliser un truc dans le genre la si personne ne
repond a ma question sur l'interpretation du php dans les pages squelettes (est-
ce que ca court-circuite les fonctions de cache de spip ?).
En réponse à Gabriel Radic <gabrielradic@timbru.com>:
Salut Christophe,
moi j'utilise une truc toute bête mais efficace, un peut de DHTML
cross-platform.
Tu ajoutes un ID sur les liens A, par ex.
<A HREF="#URL_RUBRIQUE" id="menu#ID_ARTICLE">#TITRE</A>
Et tu ajout a la fin du squelette
<BOUCLE_menuRub(RUBRIQUES){id_rubrique}>
<SCRIPT type="text/javascript" language="JavaScript">
obj = document.getElementById(id);
if (obj != null) obj.style.backgroundColor='#E0E0EE';
</SCRIPT>
</BOUCLE_menuRub>
La couleur, comme la propriété CSS peuvent être adapté. Une exemple
optimisé en-direct sur www.franta-romania.com, regarde le menu avec les
rubriques. Ce qui t'intéresse est dans /hierarchie.html et /dw.js.
-- Gabriel Radic
On mercredi, jan 8, 2003, at 08:28 Europe/Paris,
segura.christophe@free.fr wrote:
> Bonjour tout le monde,
> J'ai une question toute bete, mais pas la reponse :
> Sur mon site j'ai un menu qui me permet de naviguer sur les différents
> articles d'une rubrique, je souhaite pourvoir differencier
> visuellement le lien qui mene a un article, quand cet article est
> affiché... pfff, pas clair ca... je souhaite que quand on clique sur
> un menu, le lien sur lequel on a cliqué change d'aspect visuel, ou
> mettre une puce devant, un truc dans le genre...
> Ce menu est constitue d'une boucle qui liste tous les articles de la
> rubrique, comment indiqué dans cette boucle que le lien menant à
> l'article affiché est different des autres ?
>
> Merci
_______________________________________________
liste spip
spip@rezo.net - désabonnement : spip-off@rezo.net
Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.uzine.net/spip
From xavier.courtonne@nantesweb.com Wed Jan 8 10:35:42 2003
Return-Path: <xavier.courtonne@nantesweb.com>
Received: from mel-rto3.wanadoo.fr (smtp-out-3.wanadoo.fr [193.252.19.233])
by miel.brainstorm.fr (Postfix) with ESMTP id BB5D41CCB5
for <spip@rezo.net>; Wed, 8 Jan 2003 10:35:42 +0100 (CET)
Received: from mel-rta10.wanadoo.fr (193.252.19.193) by mel-rto3.wanadoo.fr
(6.7.015) id 3E0C33B5005EF5B7 for spip@rezo.net;
Wed, 8 Jan 2003 10:35:42 +0100
Received: from xavier (81.50.3.196) by mel-rta10.wanadoo.fr (6.7.015)
id 3E075B5C006758F8 for spip@rezo.net; Wed, 8 Jan 2003 10:35:42 +0100
From: "mailnantesweb" <xavier.courtonne@nantesweb.com>
To: <spip@rezo.net>
Date: Wed, 8 Jan 2003 10:28:01 +0100
Message-ID: <NFBBLLICFAFLFPFLLHNBCECFDBAA.xavier.courtonne@nantesweb.com>
MIME-Version: 1.0
Content-Type: multipart/mixed;
boundary="----=_NextPart_000_002E_01C2B700.9EBC0380"
X-Priority: 3 (Normal)
X-MSMail-Priority: Normal
X-Mailer: Microsoft Outlook IMO, Build 9.0.2416 (9.0.2910.0)
In-Reply-To: <0A78E7A6-22EA-11D7-8E1D-0030656AF8F0@timbru.com>
X-MimeOLE: Produced By Microsoft MimeOLE V5.50.4522.1200
Importance: Normal
Subject: [Spip] navigation dynamique
X-BeenThere: spip@rezo.net
X-Mailman-Version: 2.1rc1+
Precedence: list
List-Id: SPIP : questions/reponses <spip.rezo.net>
List-Unsubscribe: <http://listes.rezo.net/mailman/listinfo/spip>,
<mailto:spip-request@rezo.net?subject=unsubscribe>
List-Archive: <Discuter chez rezo.net;
List-Post: <mailto:spip@rezo.net>
List-Help: <mailto:spip-request@rezo.net?subject=help>
List-Subscribe: <http://listes.rezo.net/mailman/listinfo/spip>,
<mailto:spip-request@rezo.net?subject=subscribe>
X-List-Received-Date: Wed, 08 Jan 2003 09:35:43 -0000
Status: O
Content-Length: 7482
Lines: 250
C'est un message de format MIME en plusieurs parties.
------=_NextPart_000_002E_01C2B700.9EBC0380
Content-Type: text/plain;
charset="iso-8859-1"
Content-Transfer-Encoding: 8bit
bonjour et bonne année
J ai vu passer des messages sur les menus dynamique.
Pour ma part je me suis pris la tete avec coolmenu,
j ai developpé quelque chose qui me parait plus simple en puisant à droite
et à gauche,*
le principe reside sur une trés bonne astuce : Les div sont positionné par
rapport a une ancre placé a coté du logo.
a l'intérieur du calque on boucle sur ce qu on veut.
Dans l exemple présenté, la boucle est faite sur les sous rubriques d'une
rubrique principale, puis le calque affiche les articles contenus dans cette
rubrique.
le fichier position_Div.js est le script qui récupère la position de l'ancre
pour mettre le div à coté,
Voila, si vous avez rien compris c est qu on est sur la bonne voie... 
Xav
------=_NextPart_000_002E_01C2B700.9EBC0380
Content-Type: text/html;
name="navigation.html"
Content-Transfer-Encoding: quoted-printable
Content-Disposition: attachment;
filename="navigation.html"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv=3D"Content-Type" content=3D"text/html; =
charset=3Diso-8859-1">
<script language=3D"JavaScript" type=3D"text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init=3D=3Dtrue) with (navigator) {if =
((appName=3D=3D"Netscape")&&(parseInt(appVersion)=3D=3D4)) {
document.MM_pgW=3DinnerWidth; document.MM_pgH=3DinnerHeight; =
onresize=3DMM_reloadPage; }}
else if (innerWidth!=3Ddocument.MM_pgW || =
innerHeight!=3Ddocument.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
ie4 =3D ((navigator.appName =3D=3D "Microsoft Internet Explorer") && =
(parseInt(navigator.appVersion) >=3D 4 ))
ns4 =3D ((navigator.appName =3D=3D "Netscape") && =
(parseInt(navigator.appVersion) >=3D 4 ))
if (ns4) {
layerRef=3D"document.layers";
styleRef=3D"";
} else {
layerRef=3D"document.all";
styleRef=3D".style";
} =20
function afficheCalque(calque)
{
eval(layerRef + '["' + calque +'"]' + styleRef + '.visibility =3D =
"visible"');
}
function cacheCalque(calque)
{
eval(layerRef + '["' + calque +'"]' + styleRef + '.visibility =3D =
"hidden"');
}
</SCRIPT>
<script language=3D"JavaScript" src=3D"position_Div.js"></script>
</head>
<BODY >
<table width=3D"140" border=3D"0" align=3D"left" cellpadding=3D"0" =
cellspacing=3D"0">
<BOUCLE_ENVIRONNEMENT(RUBRIQUES){id_rubrique=3D1}>
<tr>=20
<td width=3D"140" align=3D"left">#LOGO_RUBRIQUE </td>
</tr>
<BOUCLE_Menu_ENVIR(RUBRIQUES){id_parent}{exclus}{unique}>
<tr>=20
<td width=3D"140" align=3D"left">
<!-- ici on gere l affichage du calque correspondant a la cellule du =
tableau=20
le calque contenant les articles se nomme div#ID_RUBRIQUE
-->
<DIV =
onmouseover=3D"afficheCalque('div#ID_RUBRIQUE');setToAnchor('#ID_RUBRIQUE=
','#ID_RUBRIQUE','div#ID_RUBRIQUE')" =
onmouseout=3D"cacheCalque('div#ID_RUBRIQUE')" >=20
<a href=3D"#URL_RUBRIQUE" =
onmouseover=3D"afficheCalque('div#ID_RUBRIQUE')" =
onmouseout=3DcacheCalque('div#ID_RUBRIQUE')>[(#LOGO_RUBRIQUE|left)]</a>
<!-- ici r=E9side une tr=E9s bonne astuce, on met en place une ancre =
dont l unique r=F4le est de permettre au script de recuperer la position =
du logo_rubrique ou autre sur la page et ainsi de positionner le div la =
ou il faut
-->
<A name=3D"#ID_RUBRIQUE"></A>
<!-- ici on cr=E9e autant de calque que de rubrique ou sous rubrique, =
en recuperant lid de la rubrqiue pour l identifier, puis on fait une =
boucle sur les articles ou ce quon veut
-->
<div id=3D"div#ID_RUBRIQUE" =
onMouseOver=3D"afficheCalque('div#ID_RUBRIQUE')" =
style=3D"position:absolute; left:150px; top:31px; width:160px; =
height:97px; visibility: =
hidden;"onMouseOut=3D"cacheCalque('div#ID_RUBRIQUE')">=20
<table width=3D"98%" border=3D"0" align=3D"center" =
cellpadding=3D"0" cellspacing=3D"0">
<BOUCLE_art(ARTICLES){id_rubrique}>
<tr>=20
<td onMouseOut=3D"style.backgroundColor=3D''; =
style.color=3D'#000000' ; style.border=3D'0 solid black'"=20
onMouseOver=3D"style.backgroundColor=3D'#FFFF99'; =
style.color=3D'#ffffff' ; style.border=3D'0 solid #CCCCCC'"><font =
color=3D"#333333" size=3D"1" face=3D"Arial"><a =
onMouseOver=3D"afficheCalque('div#ID_RUBRIQUE')"=20
onMouseOut=3D"cacheCalque('div#ID_RUBRIQUE')" =
href=3D"#URL_ARTICLE">#TITRE</a></font></td>
</tr>
<font color=3D"#333333" face=3D"Arial"></font>=20
</BOUCLE_art>
</table>
</div>
</BOUCLE_Menu_ENVIR>
</BOUCLE_ENVIRONNEMENT>
</DIV></td>
</tr>
<tr>=20
<td height=3D"79" align=3D"left"> </td>
</tr>
</table>
</body>
</html>
------=_NextPart_000_002E_01C2B700.9EBC0380
Content-Type: application/octet-stream;
name="navigation.php3"
Content-Transfer-Encoding: 7bit
Content-Disposition: attachment;
filename="navigation.php3"
<?php
$fond = "navigation";
$delais = 0 * 3600;
include ("inc-public.php3");
?>
------=_NextPart_000_002E_01C2B700.9EBC0380
Content-Type: application/x-javascript;
name="position_Div.js"
Content-Transfer-Encoding: quoted-printable
Content-Disposition: attachment;
filename="position_Div.js"
// JavaScript Document
var ns4 =3D (document.layers)? true:false; //NS 4=20
var ie4 =3D (document.all)? true:false; //IE 4=20
var dom =3D (document.getElementById)? true:false; //DOM=20
function setToAnchor(ID_Anchor,Name_Anchor,ID_Div)
//Fonction permettant de positionner un DIV =E0 une position occup=E9e =
par une ancre
{
var DivLeft =3D 0; //Position du Div par rapport au c=F4t=E9 gauche de =
la page=20
var DivTop =3D 0; //Position du Div par rapport au haut de la page=20
if (dom)
{
pos =3D document.getElementById(ID_Anchor);
DivLeft =3D getLeft(pos);
DivTop =3D getTop(pos);
document.getElementById(ID_Div).style.left =3D DivLeft;
document.getElementById(ID_Div).style.top =3D DivTop;
}
else if (ie4)=20
{
pos =3D document.all[ID_Anchor];
DivLeft =3D getLeft(pos);
DivTop =3D getTop(pos);
document.all[ID_Div].style.posLeft =3D DivLeft;
document.all[ID_Div].style.posTop =3D DivTop;
}
else if (ns4)
{
pos =3D document.anchors[Name_Anchor];
DivLeft =3D pos.x;
DivTop =3D pos.y;
document.layers[ID_Div].pageX =3D DivLeft;
document.layers[ID_Div].pageY =3D DivTop;
}
}
function getLeft(MyObject)
//Fonction permettant de conna=EEtre la position d'un objet
//par rapport au bord gauche de la page.
//Cet objet peut =EAtre =E0 l'int=E9rieur d'un autre objet.
{
if (MyObject.offsetParent)
return (MyObject.offsetLeft + getLeft(MyObject.offsetParent));
else=20
return (MyObject.offsetLeft);
}=20
function getTop(MyObject)
//Fonction permettant de conna=EEtre la position d'un objet
//par rapport au bord haut de la page.
//Cet objet peut =EAtre =E0 l'int=E9rieur d'un autre objet.
{
if (MyObject.offsetParent)
return (MyObject.offsetTop + getTop(MyObject.offsetParent));
else
return (MyObject.offsetTop);
}
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
------=_NextPart_000_002E_01C2B700.9EBC0380--
