Ciao, ho trovato questo codice che ho un pò adattato alla mia esigenza cambiando l'evento click con mouseover e funziona, però se sul pannello che appare sono contenuti altri elementi tipo div e ci passo sopra con il mouse il pannello torna allo stato originale.
C'è un modo per cui l'effetto mouseout funzioni solo quando esco dall'area del pannello ma rimanga aperto anche se con il mouse vado su elementi annidati?
Questo è l'esempio su cui sto provando:
codice:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Documento senza titolo</title> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#flip").mouseover(function(){ $("#pannello").slideDown("slow"); }); $("#pannello").mouseout(function(){ $("#pannello").slideUp("slow"); }); }); </script> <style type="text/css"> #flip { padding:5px; text-align:center; background-color:#e5eecc; border:solid 1px #c3c3c3; } #pannello { padding:50px; display:none; background-color:#cecece; } .uno { width:100px; height:50px; background-color:#ff0000; } </style> </head> <body> <div id="flip">Click to slide down panel</div> <div id="pannello">Hello world!
<div class="uno">Altro div</div> </div> </body> </html>
Molte grazie a chi mi saprà aiutare