Maison  >  Article  >  interface Web  >  jQuery implémente l'effet de diapositive de carrousel d'images

jQuery implémente l'effet de diapositive de carrousel d'images

php中世界最好的语言
php中世界最好的语言original
2018-04-24 11:21:142108parcourir

Cette fois, je vais vous présenter jQuery pour implémenter l'effet de diaporama de carrousel d'images. Quelles sont les précautions pour que jQuery implémente l'effet de diaporama de carrousel d'images. Ce qui suit est un cas pratique, jetons un coup d'œil.

Conseils : Si le navigateur ne fonctionne pas correctement, vous pouvez essayer de changer de mode de navigation.
(1) Introduisez le style CSS dans la zone d'en-tête :

<link href="styles/97zzw.css" rel="stylesheet" type="text/css" />

(2) Code js :

<script src="scripts/jquery.min_v1.0.js" type="text/javascript"></script>
<script src="scripts/slides.min.jquery_v1.0.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
 $('#slides').slides({
 preload: true,
 preloadImage: 'images/loading.gif',
 play: 5000,
 pause: 2500,
 hoverPause: true,
 fadeSpeed: 350,
 effect: 'fade'
 });
});
</script>

Effets de diaporama de carrousel d'images ultra-exquis JQuery à partager avec tout le monde Le code est le suivant



jQuery超精致图片轮播幻灯片特效
<link href="styles/97zzw.css" rel="stylesheet" type="text/css" />


 
 

 

     

  微车   布丁电影票   布丁优惠券   

 

 

  <script src="scripts/jquery.min_v1.0.js" type="text/javascript"></script> <script src="scripts/slides.min.jquery_v1.0.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){  $('#slides').slides({  preload: true,  preloadImage: 'images/loading.gif',  play: 5000,  pause: 2500,  hoverPause: true,  fadeSpeed: 350,  effect: 'fade'  }); }); </script>

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web PHP chinois !

Lecture recommandée :

Comment implémenter l'effet de glisser jquery

jQuery permet un défilement transparent des connexions d'images

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
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