Example with dinamic bullets

elchiconube commented 11 years ago

I would like to know if it is possible to create the bullet points dinamically depending on the number of slides, i think it is possible to programm with JS but I don't know where to start.. can anyone help me PLEASE? Thanks

alicelieutier commented 11 years ago

Well, this is not really the place for this type of question: it's not an issue on the Swipe library. Anyway, here are some pointers: 1- getNumSlides() gives you the number of slides 2- element.appendChild() allows you to append elements inside an element. 3- take a look at http://swipejs.com for an example of using the bullets.

elchiconube commented 11 years ago

Thanks for your comment Alice, but i'm not a javascripter and i need a little example. Please? :)

alicelieutier commented 11 years ago

ok. 1- make sure you use the last version of swipe. 2- here is a possible code to do that. It's not the best, but it should do:

    var slider =
      Swipe(document.getElementById('slider'), {
        auto: 3000,
        continuous: true,
        callback: function(pos) {
          var i = bullets.length;
          while (i--) {
            bullets[i].className = ' ';
          }
          bullets[pos].className = 'on';

        }
      });
    var i = slider.getNumSlides();
    while (i--) {
      document.getElementById('position').appendChild(document.createElement('li'));
    } 
    var bullets = document.getElementById('position').getElementsByTagName('li');

It's inspired of http://swipejs.com For the HTML, just use an empty <ul id="position"></ul> tag

elchiconube commented 11 years ago

Thank you so much for your help :+1:

thebird / Swipe

Example with dinamic bullets #285