Riporto lo schema del codice html della pagina.
codice:
<html>
<head>
<?php
@include("javascript_content.php");
?>
</head>
<body>
<?php
@include ("header_content.php");
@include ("menu_content.php");
echo ("qua il contenuto della pagina");
@include ("footer_content.php");
?>
</body>
</html>
header_content e footer_content contengono intestazione e footer della pagina e posso tralasciarli.
javascript_content è:
codice:
<script type="text/javascript" language="JavaScript" src="http://www.esempio.it/807DHTMLMenuExpander.js"></script>
menu_content è:
codice:
<table id="mainTable" border="0" cellpadding="0" cellspacing="0">
<tr class="tr1">
<td>
<table border="0" cellpadding="2" cellspacing="3">
<tr><th>SEZIONE A</th></tr>
<tr><td>punto 1</td></tr>
<tr><td>punto 2</td></tr>
<tr><td>punto 3</td></tr>
<tr><td>punto 4</td></tr>
</table>
</td>
</tr>
<tr class="tr1">
<td>
<table border="0" cellpadding="2" cellspacing="3">
<tr><th>SEZIONE B</th></tr>
<tr><td>punto X</td></tr>
<tr><td>punto Y</td></tr>
<tr><td>punto Z</td></tr>
</table>
</td>
</tr>
</table>
807DHTMLMenuExpander.js è:
codice:
//--------------------------------------------------------------------------------------------------
// All material contained within this and associated downloaded pages is the property of 4thorder(TM)
// Copyright © 2005. All rights reserved.
//
// Author: Michael Falatine || Authors email: 4thorder@4thorder.us
//
// USAGE: You may use this script for commercial or personal use, however, the copyright is retained-
// by 4thorder (TM).
//
// For other free Scripts visit: http://www.4thorder.us/Scripts/
//---------------------------------------------------------------------------------------------------
// :::::::::::::::::::::::::
// :::: Global Variables :::
// :::::::::::::::::::::::::
var firstLoad=0;
var GlobalECState=0; // 0=collapsed, 1=expanded; used for inital state of ALL branches
// :::::::::::::::::::::::::
// :::: Global Functions :::
// :::::::::::::::::::::::::
window.onload=InitializePage;
function InitializePage()
{
Headers();
attachEventhandlers();
}
// Attach event handlers to all images within container
function attachEventhandlers()
{
mainTABLEElement=document.getElementById("mainTable");
TABLECollection=mainTABLEElement.getElementsByTagName("TABLE");
if (TABLECollection!=null)
{for (l=0; l<TABLECollection.length; l++)
{
THCol=TABLECollection.item(l).getElementsByTagName("TH");
THCol.item(0).onclick=onclickHandler;
}
}
}
function Headers()
{
mainTABLEElement=document.getElementById("mainTable");
TABLECollection=mainTABLEElement.getElementsByTagName("TABLE");
if (TABLECollection!=null)
{
for (z=0; z<TABLECollection.length; z++)
{
TRCol=TABLECollection.item(z).getElementsByTagName("TR");
THCol=TABLECollection.item(z).getElementsByTagName("TH");
if(firstLoad==0)
{ // Yes: FIRST LOAD OF PAGE - set inital ECState
if(GlobalECState==0)
{// Global ECState is COLLAPSED (+) (0)
THCol.item(0).setAttribute("ECState",0);
for (j=1; j<TRCol.length; j++)
{
TRCol.item(j).style.display='none';
}
}
else
{// Global ECState is EXPANDED (-) (1)
THCol.item(0).setAttribute("ECState",1);
for (k=1; k<TRCol.length; k++)
{
TRCol.item(k).style.display='block';
}
}
}
else // No: FIRST LOAD OF PAGE - change ECState
{ // Grab ECState and expand or collapse branch
State=THCol.item(0).getAttribute("ECState");
if(State==0)
{
// ECState is COLLAPSED (+) (0)
for (l=1; l<TRCol.length;l++)
{
TRCol.item(l).style.display='none';
}
}
else
{
// ECState is EXPANDED (-) (1)
for (m=0; m<TRCol.length; m++)
{
TRCol.item(m).style.display='block';
}
}
}
}
}
if(firstLoad==0){firstLoad=1;}
}
// ::::::::::::::::::::::::
// :::: Event Handlers ::::
// ::::::::::::::::::::::::
function onclickHandler(e)
{
// Browser compatibility code
var targ;
if (!e) var e = window.event;
if (e.target) targ = e.target;
else if (e.srcElement) targ = e.srcElement;
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode;
// Toggle ECState
State=targ.getAttribute("ECState");
if(State==0)
{targ.setAttribute("ECState",1);}
else{targ.setAttribute("ECState",0);}
Headers();
}
Naturalmente "linkmenu" e "tr1" sono definiti nel foglio di stile.
Quando viene cliccata una voce di una SEZIONE si apre il menu con i PUNTI e fin qua mi va bene così.
Quando viene cliccato un PUNTO questo punta ad aprire una nuova pagina che però, ricaricandosi da capo, perde le
SEZIONI aperte.
Vorrei che quando la nuova pagina si apre rimanessero le sezioni che si erano aperte precedentemente.
E' possibile farlo con questa applicazione javascript o è meglio utilizzare qualcosa di diverso?
Grazie.