Salve! Volevo aggiungere al mio menu l'effetto bounce al passaggio del mouse, solo che l'effetto funziona ma non bene.. le caselle si spostano leggermente verso sinistra e poi se passo con il mouse su più caselle fa un casino... e non come risolverlo chiedo aiuto ai professionisti
ecco la pagina con il menu e l'effetto:http://destinationluccaceg.altervista.org/#section3

ed ecco il codice:

codice HTML:
<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <title>Senza nome 1</title>
    <style>
      .menu{
        position:fixed;
        top:0; 
       left:0;
        list-style:none; 
       margin:0;
        padding:0;
        display:table;
        z-index:350;
        width:100%;
      }
      .menu li{
        display:table-cell;
       width:16.66666666666666%;
        border-bottom:4px solid #000000;
      }
      .menu li a{
        display:block;
        color: #fff;
        font:bold small-caps 18px Arial,Helvetica,sans-serif;
        padding:10px 0px 10px 0px;
        text-align:center;
        text-decoration:none;
        text-shadow:1px 1px 2px #666;
        filter:shadow(color=#666666,direction=135,strength=2);
       }
     .menu .c1 { background:#404040 }
      .menu .c2 { background:#ffc900 }
      .menu .c3 { background:#ff8957 }
      .menu .c4 { background:#ff2525 }
      .menu .c5 { background:#bad700 }
      .menu .c6 { background:#49b6e8 }
    
     .active a { color:#e5e4e2 }
    </style> 
   <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
  </head>
  <body>
    <ul class="menu">
      <li class="c1 active"><a href="#section1">Section1</a></li>
      <li class="c2"><a href="#section2">Home</a></li>
      <li class="c3"><a href="#section3">Section3</a></li>
      <li class="c4"><a href="#section4">Section4</a></li>
      <li class="c5"><a href="#sectopm5">Section5</a></li>
      <li class="c6"><a href="#section6">Section6</a></li>
    </ul>
    <script>
      $( "li" ).hover(function() {
        $( this ).effect( "bounce", "slow" );
      });
    </script>
  </body>
</html>