barra navigazione javascript
salve atutti e grazie anticipatre io ho una barra di navigazione in javascript con un problema se la pagina che si sta visitando in questo momento non è completamente caricata e voi cliccate su vostra festa o su contatti della barra di navigazione dice che nn è stata trovata una pagina il che è vero è una finta pagina che usa il codice javascript qualcuno potrebbe correggermelo o trovarmi qualcosa di simile grazie mille
codice html:
Codice:
<div id="nav">
<ul id="tabBar">
<li><a href="index.php">Home</a></li>
<li><a href="/work.html" rel="menutrigger" name="vostrafesta">La vostra festa</a></li>
<li><a href="/work.html" rel="menutrigger" name="contatti">Contatti</a></li>
</ul>
<div id="subNav">
<ul id="vostrafestaNav">
<li><a href="magia.php">Magia</a></li>
<li><a href="sculture palloncini.php">Sculture di Palloncini </a></li>
<li><a href="giochi.php">Giochi e Intrattenimento</a></li>
<li><a href="addobbi.php">Addobbi e Decorazioni</a></li>
<li><a href="locali pubblici.php">Feste in Locali Pubblici
</a></li>
</ul>
<ul id="contattiNav">
<li><a href="contatti.php">Contatti</a></li>
<li><a href="commenti.php">Commenti</a></li>
</ul>
</div>
</div>
</div>
codice javascript:
Codice:
function hideItems() {
var list = document.getElementById("subNav").getElementsByTagName("ul");
for(i=0;i<list.length;i++) {
list[i].style.display="none";
}
}
function navMenu() {
if (!document.getElementsByTagName){ return; }
var anchors = document.getElementsByTagName('a');
for (var i=0; i<anchors.length; i++){
var anchor = anchors[i];
var relAttribute = String(anchor.getAttribute('rel'));
if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match('menutrigger'))){
anchor.onclick = function() {
var nameAttribute = this.getAttribute('name') + "Nav";
var thismenu = document.getElementById(nameAttribute);
hideItems();
thismenu.style.display="inline";
return false;
}
}
}
}
css(penso sia inutile postarvela ma nn si sa mai):
Codice:
/*menu*/
#nav {
width:100%;
height:50%;
margin-bottom:2.4em;
padding:0;
background-color: #36C;
}
#nav * {
text-align:center;
color:#fff;
font-weight:bold;
text-decoration:none;
font-family:arial, helvetica, sans-serif;
font-size:9pt;
}
#nav ul, #nav ul li {
margin:0;
padding:0;
}
#nav ul li {
display:inline;
}
ul#tabBar {
float:right;
background-color: #36c;
}
ul#tabBar li a {
display:block;
float:left;
width:115px;
height:2em;
line-height:3em;
background:url(/immagini/tab_bg.jpg) 0 10px no-repeat;
border-left:0em solid #fff;
overflow:hidden; /* fixed IE display bug */
background-color: #36C;
}
ul#tabBar li a:hover {
line-height:29px;
background-color: #36c;
background:url(/immagini/tab_bg.jpg) top left no-repeat;
}
#subNav ul {
display:none;
}
#subNav {
clear:both;
height:3.3em;
background:url(/immagini/subnav_bg.jpg) top left repeat-x;
padding-left:100px;
}
#subNav ul {
float:left;
background:url(/immagini/subnav_seperator.jpg) top left no-repeat;
}
#subNav ul li a {
display:block;
float:left;
width:13em;
text-align:center;
line-height:3em;
background:url(/immagini/subnav_seperator.jpg) top right no-repeat;
margin-right: 0em;
}
#subNav li a:hover {
color:#cde7ff;
}
