Outils pour utilisateurs

Outils du site


cours2011:bases_de_la_programmation_orientee_objets_et_evenementielle:tp_divers

TP Divers

Panneau escamotable

Faire le code vu en TD.

Puis ensuite, le mettre sous forme de fonction :

jQuery(function (){
  function panneau(elem){
    var panneau = $(elem);
    console.log(panneau.find('.poignee'));
    // ici le "même" code
  }
 
  panneau("#panneau");
});

Boutons précédant / suivant

Partant du TP : Slider - Animation CSS (source)

Ajouter au code HTML des boutons :

  <nav>
    <p id="avant">Avant</p>
    <ul id="navigation">
      <li><a href="#slide1" accesskey="1">1</a></li>
      ...
    </ul>
    <p id="apres">Après</p>
  </nav>

Pour les gérer par JavaScript :

  $('#avant').click(function (){
    var courant = $('#slider').find('.courant');
    if (!courant.is(':first-child')) {
      var slide = courant.prev();
      // ici la suite ...
    }
  });

Essayer de faire de même pour le slider classique. Il y'a besoin d'utiliser une variable pour mémoriser l'élément courant. Ou de lui ajouter une classe.

Galerie

Partant de cette archive.

Obtenir ce résultat.

cours2011/bases_de_la_programmation_orientee_objets_et_evenementielle/tp_divers.txt · Dernière modification: 2012/04/10 22:00 (modification externe)