Problemi menu dinamico

11-06-2011, 10.53.01

Salve.
Ho un problema con Javascript.
Ho inserito un menu di navigazione dinamico in javascript ed allo stesso tempo una galleria di immagini scorrevole presi dalla raccolta degli script presente nel sito “HTML.it”
Però ho un problema con il menu di navigazione che non si espande correttamente (è lento rispetto allo script originale ed il segno “+” che indica la presenza di eventuali sublivelli non è allineato orizzontalmente con la prima voce del menu, alla quale si riferisce).
Il codice della pagina è il seguente:

Codice HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<HTML>
<head>
<link rel stylesheet="COMUNE.css"> 
<link rel stylesheet="PRIMA_PAGINA.css">

<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="scriptbreaker-multiple-accordion-1.js"></script>
<script language="JavaScript">

$(document).ready(function() {
	$(".topnav").accordion({
		accordion:false,
		speed: 600,
		closedSign: '[+]',
		openedSign: '[-]'
	});
});

</script>
<style>
.topnav {
	width: 213px;
	padding: 40px 28px 25px 0;
	font-family: "CenturyGothicRegular", "Century Gothic", Arial, Helvetica, sans-serif;
}

ul.topnav {
	padding: 0;
	margin: 0;
	font-size: 1em;
	line-height: 0.5em;
	list-style: none;
}

ul.topnav li {}

ul.topnav li a {
	line-height: 10px;
	font-size: 11px;
	padding: 10px 5px;
	color: #000;
	display: block;
	text-decoration: none;
	font-weight: bolder;
}

ul.topnav li a:hover {
	background-color:#675C7C;
	color:white;
}

ul.topnav ul {
	margin: 0;
	padding: 0;
	display: none;
}

ul.topnav ul li {
	margin: 0;
	padding: 0;
	clear: both;
}

ul.topnav ul li a {
	padding-left: 20px;
	font-size: 10px;
	font-weight: normal;
}

ul.topnav ul li a:hover {
	background-color:#D3C99C;
	color:#675C7C;
}

ul.topnav ul ul li a {
	color:silver;
	padding-left: 40px;
}

ul.topnav ul ul li a:hover {
	background-color:#D3CEB8;
	color:#675C7C;
}

ul.topnav span{
	float:right;
}
</style>

<title>Un classico e pratico slideshow con jQuery - Esempio JavaScript scaricato da HTML.it</title>
	<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
	<meta http-equiv="Content-Language" content="it" />
	<meta name="Robots" content="All" />
	<meta name="Description" content="HTML.it - il sito italiano sul Web publishing" />
	<meta name="Keywords" content="javascript" />
	<meta name="Owner" content="HTML.it srl" /> 
	<meta name="Author" content="HTML.it srl" />  
	<meta name="Copyright" content="HTML.it srl" />
	<style>
        #slider {width: 450px; height: 250px; padding:0; border:0;}
        #slider img {padding: 0; margin:0; border:0;}
        #slider .clicker a {width: 11px; height: 11px; background: #fff; margin-right: 2px;}
        #slider .clicker a.active {background: #ff0;}
</style>

<script type="text/javascript" src="scriptbreaker-multiple-accordion-1.js"></script>
<script src="jquery.hslide.js"></script> 
<script>
        $(function(){
                $('#slider').hslide();
        });
</script>

	</head>
<body background="sfondoweb.jpg">

<div style="width:90%; height:50%; border: 3pt solid black">
<div style="width:20%; height:100%; float: left; border: 3pt solid black">
<ul class="topnav">
<li><a href="#">About us</a>
<ul>
<li><a href="#">Cookies</a></li>
<li><a href="#">Events</a></li>
</ul>
</li>
<li><a href="#">Contact</a></li>
<li><a href="#">Upload script</a></li>
</ul>
</div>

<div style="width:90%; height:40%; border:3pt solid black;">    
</div>
</div>
<center>
<div id="slider">
        <div><img src="http://placehold.it/450x250&text=1"></img></div>
        <div><img src="http://placehold.it/450x250&text=2"></img></div>
        <div><img src="http://placehold.it/450x250&text=3"></img></div>
        <div><img src="http://placehold.it/450x250&text=4"></img></div>
        <div><img src="http://placehold.it/450x250&text=5"></img></div>
</div>

</center>
</body>
</html>

Questo è il foglio di stile “COMUNE.css”:

Codice:

p{
	text-align: justify;
	font-size: 14pt;
	font-style: italic;
	font-weight: bold;
	color:#FFFFFF
	}

Secondo voi, da cosa può dipendere il malfunzionamento dello script del menu?

Grazie.
Ciao.

P.S. Per ragioni di brevità non vi posto gli script esterni richiamati nel foglio html, ma se dovessero servire posso inviarli.

**karl94** · 11-06-2011, 12.46.20

Puoi indicare l'indirizzo dell'esempio originale di HTML.it?

Discussione: Problemi menu dinamico

LinkBack

Strumenti discussione

Display

Problemi menu dinamico

Regole di scrittura