« Programmation JavaScript/Programmer en deux minutes/Tout un site web dans un seul document » : différence entre les versions
Contenu supprimé Contenu ajouté
Ligne 74 :
== Avec la librairie d'instructions jQuery ==
Nous allons créer un site dans la division d'id galerie. Elle contient trois divisions dont deux boutons (<code>div#next</code> et <code>div#previous</code>) et une très
;CSS :
Ligne 102 :
;Javacript :
:$ est l'objet jQuery. Le script exécute, lorsque le document est prêt c'est-à-dire que tout est chargé, une fonction créant l'objet slider().
slider("#galerie") modifie les styles de #slide, #next et #previous.
<source lang=javascript>
$(document).ready(function() {
$ = new slider("#galerie");
Ligne 111 ⟶ 113 :
var self=this;
this.div = $(id);
this.
this.next=this.div.find('#next');▼
this.prev=this.div.find('#previous');▼
this.prev.hide(); // Cache le bouton previous en attendant que l'utilisateur clique sur next.
this.largeurDesPages=0; // Largeur totale des div.page contenues dans #slide
this.slide=this.div.find('#slide');
this.slide.find('.page').each(function(){
self.
});
▲ this.next=this.div.find('#next');
▲ this.prev=this.div.find('#previous');
this.
this.courant=0; // Le numéro de la page courante.
this.next.click(function(){
Ligne 160 ⟶ 162 :
}
});
alert("largeur totale des pages : "+this.
+"saut : "+this.saut+"px\n"
+"nbSaut: "+this.nbSaut
);
}
</source>
|