Orbit è un leggerissimo plugin per la visualizzazione delle immagini basato su jQuery (2.8kb compresso). Codice HTML è abbastanza pulito e le didascalie sono generate dal tag “title” delle immagini.
Le immagini possono essere sfogliate utilizzando i pulsanti prev-next che appaiono al passaggio del mouse, in più un timer opzionale lascia intuire quando l’immagine successiva verrà visualizzata.
Questo semplice plugin ha molte opzioni come il tipo di animazione, velocità delle animazioni, abilitare/disabilitare i pulsanti prev-next, didascalie, timer e altro ancora.
Il funzionamento è semplicissimo, dopo aver scaricato e scompattato il pacchetto zip, si passa ad aggiungere pochissime righe di codice alla nostra pagina web.
Aggiungiamo innanzi tutto queste due righe tra i tag <HEAD> e </HEAD> delle nostra pagina
[sourcecode language=”html”]
<div id="_mcePaste"><script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.orbit.min.js" type="text/javascript"></script></div>
[/sourcecode]
Dopodiché richiamiamo il foglio di stile
[sourcecode language=”html”]
<link rel="stylesheet" href="css/orbit.css">
[/sourcecode]
Inseriamo lo script per attivare Orbit
[sourcecode language=”html”]
<script type="text/javascript">
$(window).load(function() {
$(‘#featured’).orbit();
});
</script>
[/sourcecode]
E infine creiamo il nostro DIV
[sourcecode language=”html”]
<div id="featured">
<img src="link.jpg" title="Link galliantly riding the majestic Epona across the hyrulian plains" alt="Link" />
<img src="ezio.jpg" alt="Ezio" />
<img src="masterchief.jpg" title="Master Chief surveying Reach, home of his upcoming game" alt="Master Chief" />
<img src="marcusfenix.jpg" alt="Marcus Fenix" />
</div>
[/sourcecode]
Il gioco è fatto!!
Come detto Orbit possiede moltissime opzioni, ma vi rimando al sito per approfondire questi aspetti.
Ciao devo fare un menu come il tuo piu o meno ma non per immagini, deve essere per div o classe a seconda quale sia meglio.Devo fare in modo che cliccando sulle frecce next e previous vada alla slide precedente o successiva.Inoltre non voglio che faccia l’animazione timer per forza, non mi serve volendo.Puoi aiutarmi perchè ho preso un codice da un altro utente ma non mi funziona,Perchè credo non vada bene anche per div il tuo menu animato.Puoi dirmelo a voce, al limito ti invio il codice.Anzi ti do il link del sito (index solo) cosi hai un idea di quello che vorrei fare, guarda sul sito e dimmi come devo costruire al melgio il mio menu.Scusami ma sono ingorante in codice
https://poesieracconti.site90.com/index.php ecco il lnk.Rispondimi al più presto