JQuery TOOLS
Taggato: jquery jquery-tools slider, topic-245
- Questo topic ha 6 risposte, 2 partecipanti ed è stato aggiornato l'ultima volta 12 anni, 1 mese fa da macintel.
- AutorePost
- 2 Marzo 2012 alle 08:45 #1678macintelPartecipante
Salve, sto usando questa libreria UI: JQuery TOOLS.
Sto cercando di implementare uno scroller di slide come questo:Mi chiedevo se qualcuno ha esperienza con questa libreria, perche mi trovo in difficoltà nell’agiungere una navigazione personale in aggiunta ai bottoni “avanti in dientro”.La mia struttura html è tipo:Ora con i tasti avanti e indietro scorro di un’immagine alla volta, poi vorrei aggiungere una navigazione per gruppi, cioè un link a “gruppo-2” che mi scorra direttamente alla slide con quella classe.Scusate se sono stato prolisso, qualcuno può aiutarmi?2 Marzo 2012 alle 11:02 #2027kolmogorovPartecipanteCiao, la struttura html non si vede, prova a reinserirla. A quanto ho capito, ti interessa aggiungere da qualche parte un link in cui tu clicchi e non ti fà il semplice next di uno step ma ti porti ad una slide a tuo piacimento da te scelta. Dalla documentazione emerge che lo spostamento, lo si possa fare per index o numero di step rispetto a quello corrente. Per cui io mi atterrei ai metodi che il plugin mette a disposizione per fare gli scorrimenti delle slide. Vedi la doc ufficialehttp://flowplayer.org/tools/scrollable/index.html#navigatorGuarda la funzione: seekTo(index, speed)Provo a darti una soluzione,e mi dici se potrebbe fare al tuo caso://creo due link a due possibili gruppi. uno con id=”gruppo-2″ ed uno con id= “gruppo-3”
[html]vai a gruppo-2vai a gruppo-3[/html]
$(function () {
$(“.scrollable”).scrollable({ circular: true });
// get scrollable API
var api = $(“.scrollable”).data(“scrollable”),
indici = {“gruppo-2”:2, “gruppo-3”};
//bada che indici contiene l’associazione nome-del-gruppo con la
//posizione, per cui la devi settare bene
$(“.navigator”).click(function(e){
e.preventDefault();
var gruppo = $(this).attr(“id”);
var indexGruppo = indici[gruppo];
// ora muovi lo slide alla posizione index ed alla velocità 400
api.seekTo(indexGruppo, 400) ;});`
Prova e fammi sapere perchè non l’ho fatto girare.3 Marzo 2012 alle 07:40 #2028macintelPartecipanteGrazi per l’aiuto intanto.Ho provato a fare una prova al volo e non funziona il log dice “b is undefined”.Comunque è già un ottimo inizio appena riesco provo ad approfondire il tuo esempio mi sembra che ci siamo…, provo.P.S.: la classe navigator e associata a ogni ancora con href “gruppo-x” giusto?P:S.:Se ho 6 slide e la quinta slide a un id gruppo-11 l’array sarà gruppo-11:5…?Grazie ancora anche solo per lo spunto!3 Marzo 2012 alle 10:32 #2029kolmogorovPartecipanteCiao, non vedendo il tuo codice, non posso vedere cosa sia successo relativamente alla “b”. Purtroppo nella risposta non è uscito l’html dei due link di esempio, te li inserisco in jsFiddle, che è meglio per visualizzare gli esempi e farli girare! La mia risposta è si riguardo la slide 6. L’indice parte da 0. Fammi sapere, quarda l’html delle ancore:
http://jsfiddle.net/HtpaR/3 Marzo 2012 alle 10:33 #2030kolmogorovPartecipanteCiao, non vedendo il tuo codice, non posso vedere cosa sia successo relativamente alla “b”. Purtroppo nella risposta non è uscito l’html dei due link di esempio, te li inserisco in jsFiddle, che è meglio per visualizzare gli esempi e farli girare! La mia risposta è si riguardo la slide 6. L’indice parte da 0. Fammi sapere, quarda l’html delle ancore:
http://jsfiddle.net/HtpaR/3 Marzo 2012 alle 10:34 #2031kolmogorovPartecipanteCiao, non vedendo il tuo codice, non posso vedere cosa sia successo
relativamente alla “b”. Purtroppo nella risposta non è uscito l’html dei
due link di esempio, te li inserisco in jsFiddle, che è meglio per
visualizzare gli esempi e farli girare! La mia risposta è si riguardo la
slide 6. L’indice parte da 0. Fammi sapere, quarda l’html delle ancore:
http://jsfiddle.net/HtpaR/3 Marzo 2012 alle 13:58 #2032macintelPartecipanteOkey, ora con più tempo ho studiato il tuo esempio, la doc e sono riuscito a farlo funzionare in maniera “statica” se così si può dire. Graazie.
Ora devo capire come rendere dinamica la variabile indice!Nel senso che io non saprò in che posizione sta il gruppo-2 o il gruppo-3, o meglio lo so solamente grazie ad un id associato alla prima slide di ogni gruppo es.:(div id=”gruppo-6″ class=”item”)(div /)(div class=”item”)(div /)(div id=”gruppo-8″ class=”item”)(div /)(div id=”gruppo-10″ class=”item”)(div /)In più i gruppi sono dinamici…, dovrei creare l’indice trammite l’id delle slide… - AutorePost
- Devi essere connesso per rispondere a questo topic.