Sono riuscito a risolvere quasi tutto, mi manca solo l'ultima parte che proprio non riesco ad arrivarci :-/
In pratica i <div> devono essere nascosti al caricamento della pagina e devono apparire nell'istante in cui si clicca sull'immagine corrispondente, invece al caricamento escono tutti i <div> assieme uno sotto l'altro...
Allego il tutto qui sotto, per piacere datemi una risposta..
codice HTML:<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>PROVA</title> <link rel="stylesheet" href="stile.css" type="text/css"> <script src="https://code.jquery.com/jquery-1.10.2.js"> </script> </head> <body> <section id="section"> <img id="pulsante" src="pulsante1.jpg" alt=""> <img id="bottone" src="pulsante1.jpg" alt=""> <div id="prova"> <img id="toggle1" src="pulsante1.jpg" alt=""> <img id="toggle" src="pulsante1.jpg" alt=""> </div> <div id="prova1"> <img id="toggle2" src="pulsante1.jpg" alt=""> <img id="toggle3" src="pulsante1.jpg" alt=""> </div> <img id="test1" src="Cattura3.jpg" alt=""> <img id="test" src="Cattura1.jpg" alt=""> </section> </body> <script type="text/javascript"> $ (function() { $ ('#pulsante' ) .click (function() { $ ('#prova') .toggle (500); }); }); $ (function() { $ ('#toggle' ) .hover (function() { $ ('#test') .toggle (500); }); }); $ (function() { $ ('#toggle1' ) .hover (function() { $ ('#test1') .toggle (500); }); }); $ (function() { $ ('#bottone' ) .click (function() { $ ('#prova1') .toggle (500); }); }); $ (function() { $ ('#toggle2' ) .hover (function() { $ ('#test') .toggle (500); }); }); $ (function() { $ ('#toggle3' ) .hover (function() { $ ('#test1') .toggle (500); }); }); </script> </html>
Rispondi quotando