Visualizzazione dei risultati da 1 a 5 su 5
  1. #1
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205

    Blocchi numerazione slide differenti Jquery

    Ciao,

    nella mia pagina html ho una slide.

    codice HTML:
    <div class="container">
                <div class="item count" data="menu1" data-position="1"><h4>Slide 1</h4></div>
                <div class="item count" data="menu2" data-position="2"><h4>Slide 2</h4> </div>
                <div class="item count" data="menu2" data-position="2"><h4>Slide 2 bis</h4> </div>
                <div class="item count" data="menu2" data-position="2"><h4>Slide 2 tris</h4> </div>
                <div class="item count" data="menu3" data-position="5"><h4>Slide 5</h4> </div>
                <div class="item count" data="menu6" data-position="6"><h4>Slide 6</h4> </div>
    </div>
    Ho creato uno script che identifica quanti div ci sono e crea una lista di button numerati per navigare tra le slide.

    codice:
    var number_slide = $('.container .item').length;
    var number = '';
    
    for (var n = 1; n < number_slide; ++ n) {    
      number += '<div class="owl-dot"><span>' + n +'</span></div>';
    }    
    $('div.owl-dots').html(number);
    La navigazione è al completo. Solo che io vorrei creare differenti navigazioni in base all'attributo DATA dei vari div.item

    Quindi in sostanza, quando cambia DATA c'è una nuova navigazione con numerazioni diversa in base al numero delle slide.

    Come posso farlo con jquery?

    Grazie

  2. #2
    Utente di HTML.it L'avatar di lukezz
    Registrato dal
    Feb 2010
    Messaggi
    494
    Intendi quel data="menu1" ecc?

  3. #3
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205
    Si per ogni valore di DATA (es: menu1, menu2, menu3 ecc.... )

  4. #4
    Utente di HTML.it L'avatar di lukezz
    Registrato dal
    Feb 2010
    Messaggi
    494
    Potresti fare un esempio su www.jsfiddle.net ?
    Con il tuo codice funzionante.

  5. #5
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205
    Ciao, guarda non riesco a replicarti bene su jsfiddle tutto lo script. Comunque il codice è quello che ho messo in questo post. Se vuoi maggiori informazioni scrivimi pure.

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.