CoppoWeb : javascript (UT

Ouvrir une table des matières "flottante"

Vous avez plusieurs méthodes à votre disposition :
"Examiner et emprunter" le code DHTML de Joust Technology :
(cf. http://www.alchemy-computing.co.uk/
) ce code est brillant, mais la page est un peu longue à charger, et les modifications pour l'adapter à votre cas vous demanderont pas mal d'efforts (débutants s'abstenir),
ou bien...,
Vous pouvez prendre l'une de mes astuces : une vraie-fausse palette flottante.
Moins d'effort de création, moins brillant sur le plan technique, mais plus imple à mettre en oeuvre et surtout dix fois plus rapide à exécuter.
A vous de voir...

Cliquez sur le Plan du site :

Utilisation :

<center><P>	<a href="javascript:rs('st','teleplan.html',205,330)">Plan du site</a></p><br></center>

Code source :

Sauvegardez les images suivantes

Créez les pages teleplan.htm, teleplan1.html, ..

<HTML>
<HEAD>   
<TITLE>Plan du Site      </TITLE>
</HEAD>
<BODY BGCOLOR="#ffffcc">
<table border=0 cellspacing=0 cellpadding=0 width=230>
<tr><td><table border=0 cellpadding=0 cellspacing=0 WIDTH="100%">
<tr><td colspan=3><table cellspacing=0 cellpadding=0>
<tr><td><a href="teleplan1.html"><img src="plustop.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan1.html">Philatélie</a></font></td></tr>
<tr><td><a href="teleplan2.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
<td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan2.html">Luc-Olivier Merson</a></font></td></tr>
<tr><td><a href="teleplan3.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan3.html">Créez votre site</a></font></td></tr>
<tr><td><a href="teleplan4.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan4.html">Recherches</a></font></td></tr>
<tr><td><a href="teleplan5.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan5.html">Rhétorique</a></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><A HREF="ecrire.html" TARGET="fenetreindex">Ecrire</a></font></td></tr>
<tr><td><img src="joinbottom.gif" width=18 height=16 alt="" border="0"></td>
    <td><A HREF="ego.html" TARGET="fenetreindex"><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1">T. Coppolani</font></a></td></tr>
	</table>
</td></tr></table></td></tr></table>
</BODY>
</html>

<HTML>
<HEAD>   
<TITLE>Plan du Site      </TITLE>
</HEAD>
<BODY BGCOLOR="#ffffcc">
<script language="javascript">
<!--
function cl(u) {
window.close(u);
}

//-->
</script>

<table border=0 cellspacing=0 cellpadding=0 width=230>
<tr><td><table border=0 cellpadding=0 cellspacing=0 WIDTH="100%" BGCOLOR="#ffffcc">
<tr><td colspan=3><table cellspacing=0 cellpadding=0>
<tr><td><a href="teleplan.html"><img src="minustop.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a  href="teleplan.html">Philatélie</a></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="actualite/actua2.html" TARGET="fenetreindex">Actualité</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><A HREF="merson/chroniques/chro2.html" TARGET="fenetreindex"><i>Histoire, philatélie 1846-1935</i></A></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="merson/me_01.html" TARGET="fenetreindex">Les timbres au type Merson</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="corse/corse2.html" TARGET="fenetreindex">La Corse en timbres</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="poetes/cercle.html" TARGET="fenetreindex">Les poètes français timbrifiés</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="phila2.html" TARGET="fenetreindex">Les liens philatéliques</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="momes/mom2.html" TARGET="fenetreindex">L'Espace Jeunes : Philamômes</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="dico.html" TARGET="fenetreindex">Lexique philatélique</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="paris/pa2.html" TARGET="fenetreindex">Visite du Paris des Philatélistes</a></i></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><i><a href="http://clubs.yahoo.com/clubs/philateliefrancaise" TARGET="fenetreindex">Club Philatélique Yahoo!</a></i></font></td></tr>
<tr><td><img src="plus.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan2.html">Luc-Olivier Merson</a></font></td></tr>
<tr><td><a href="teleplan3.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan3.html">Créez votre site</a></font></td></tr>
<tr><td><img src="plus.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan4.html">Recherches</a></font></td></tr>
<tr><td><a href="teleplan5.html"><img src="plus.gif" width=18 height=16 alt="" border="0"></a></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><a href="teleplan5.html">Rhétorique</a></font></td></tr>
<tr><td><img src="join.gif" width=18 height=16 alt="" border="0"></td>
    <td><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1"><A HREF="ecrire.html" TARGET="fenetreindex">Ecrire</a></font></td></tr>
<tr><td><img src="joinbottom.gif" width=18 height=16 alt="" border="0"></td>
    <td><A HREF="ego.html" TARGET="fenetreindex"><FONT FACE="GENEVA, ARIAL, MS SANS SERIF, SANS-SERIF" SIZE="1">T. Coppolani</font></a></td></tr>
	</table>
</td></tr></table></td></tr></table>
</BODY>
</html>

Code à insérer dans votre page d'appel du menu flottant

<script language="javascript">
<!--
var remote = null;
window.name="fenetreindex";
function rs(n,u,w,h) {
remote = window.open(u, n, 'width=' + w + ',height=' + h +',resizable=yes,scrollbars=no');
if (remote != null) {
if (remote.opener == null)
remote.opener = self;
remote.location.href = u;
}
}
function cl(u) {
window.close(u);
}

//-->
</script>
<NOSCRIPT>
<a href="../teleplan.html">Votre navigateur ne peut exécuter du javascript, cliquez ici</a>
</NOSCRIPT>

Index