Maison > interface Web > js tutoriel > Explication détaillée de l'exemple de code jquery.slides.js_jquery

Explication détaillée de l'exemple de code jquery.slides.js_jquery

WBOY
Libérer: 2016-05-16 15:32:08
original
1236 Les gens l'ont consulté

Slides – est un plugin de diaporama jQuery simple, facile à personnaliser et à styliser.

Slides fournit des effets de fondu ou de transition de diapositive, un fondu d'entrée et de sortie d'image, une précompression d'image, une génération automatique de pagination, une boucle, une personnalisation de la lecture automatique et de nombreuses autres options.

Avec le plug-in Slides, vous pouvez mélanger les diapositives et définir celle avec laquelle vous souhaitez démarrer le diaporama. Il est livré avec de nombreuses instructions et exemples.

Plus de bêtises, laissez-moi juste vous poster le code

 $(function(){
 $("#slides").slidesjs({
  play: {
  active: true,
   // [boolean] Generate the play and stop buttons.
   // You cannot use your own buttons. Sorry.
  effect: "slide",
   // [string] Can be either "slide" or "fade".
  interval: ,
   // [number] Time spent on each slide in milliseconds.
  auto: false,
   // [boolean] Start playing the slideshow on load.
  swap: true,
   // [boolean] show/hide stop and play buttons
  pauseOnHover: false,
   // [boolean] pause a playing slideshow on hover
  restartDelay: 
   // [number] restart delay on inactive slideshow
  }
 });
 });
Copier après la connexion

Réception :

<!doctype html>
 <head>
 <style>
  /* Prevents slides from flashing */
  #slides {
  display:none;
  }
 </style>
 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
 <script src="jquery.slides.min.js"></script>
 <script>
  $(function(){
  $("#slides").slidesjs({
   width: ,
   height: 
  });
  });
 </script>
 </head>
 <body>
 <div id="slides">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
 </div>
 </body>
Copier après la connexion

Le contenu ci-dessus est tout le code sur jquery.slides.js, j'espère qu'il vous plaira.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal