ciao a tutti!
sono nuovo del forum!
da autodidatta, con l'aiuto delle guide di questo sito, sto cercando di imparare a scrivere pagine web...
Sto provando a scrivere una semplice pag web... ma ho il seguente problema:
vorrei inserire questo menu http://javascript.html.it/demo/javas...13/esempio.htm nell'header e quest'altro http://javascript.html.it/demo/javas...53/esempio.htm nella colonna laterale. il problema è che dopo aver aggiunto il menu PopMenu nella colonna laterale il primo menu ha smesso di funzionare, ovvero il menu al passaggio del mouse non scompare, ma rimane sempre "esteso"... il problema credo stia nei CSS e non negli script...
ecco cosa ho fatto:

codice:
<script src="menuPrincipale/jquery.js" type="text/javascript"></script>
<script src="menuPrincipale/interface.js" type="text/javascript"></script>
<script src="menuPrincipale/rb_menu.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="menuPrincipale/rb_menu.css" media="screen,projection" />

----------------------------------------------------------------------

<div id="menu1" class="menu">
      <div class="rb_toggle"><span>menu &#187;</span></div>
                  <div class="rb_menu">
                      <ul>[*]Home[*]Facts[*]Projects[*]Press[*]Jobs[*]Contacts[*]Log in[/list]
                    </div>
         </div>
        <script type="text/css">
                  $('#menu1').rb_menu();
         </script>

-----------------------------------------------------------------------

.menu {
    font-family: arial, verdana, sans-serif;
    position: relative;
}

.rb_toggle {
    height: 25px;
    line-height: 25px;
    padding: 0 5px 0 0;
}
.rb_toggle span {
    color: #999;
    font-size: 11px;
    font-weight: bold;
    font-family: arial, verdana, sans-serif;
    cursor: hand;
    cursor: pointer;
}
.rb_toggle span.hover {
    color: red;
}

.rb_menu {
    position: absolute;
    left: 50px;
    top: 0;
}

.rb_menu ul,
.rb_menu li {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.rb_menu li {
    float: left;
    height: 25px;
    line-height: 25px;
    padding: 0 10px 0 0;
}
.rb_menu a {
    font-size: 16px;
    font-weight: regular;
    color: #f90;
    text-decoration: none;
}
.rb_menu a:hover {
    text-decoration: underline;
}
.rb_menu a.current {
    color: #999;
}


.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
codice:
<link href="menuNavigation/style.css" type=text/css rel="stylesheet" />
      <script src="menuNavigation/mootools83.js" type=text/javascript></script>
      <script type=text/javascript>
              Window.onDomReady(function(){
                    Window.disableImageCache();
                    $S('#popMenu li a').each(function(el) {
                           var effect = el.effect('background-position', {duration: 500, wait: false, transition: fx.Transitions.circOut, fps: 50}).set(-300);
                           el.addEvent('mouseover', effect.goTo.pass(0, effect)).addEvent('mouseout', effect.goTo.pass(-300, effect));
                    });
              });
      </script>

--------------------------------------------------------------------

<div id="navigation" class="menuLaterale">
                     <ul id=popMenu>[*]<span>Slackware</span>[*]<span>Debian</span>[*]<span>Fedora</span>[*]<span>Ubuntu</span>[/list]
           </div>

---------------------------------------------------------------------

.menuLaterale {
        margin:0; 
        padding:0;
}
.menuLaterale ul {
	padding-right: 0px;
	padding-left: 0px;
	padding-bottom: 0px;
	margin: 0px;
	padding-top: 0px;
	list-style-type: none;
}
.menuLaterale li {
        display: block;
	margin-bottom: 2px;
}
.menuLaterale a {
	display: block;
	background: #eee url('background.png') no-repeat -300px 0px;
	color: #666;
	text-decoration: none;
}
.menuLaterale a:hover {
	color: orange;
}
.menuLaterale a span {
	display: block;
        width: 250px;
}