Maison > Article > interface Web > Native js implémente des images de carrousel de développement mobile et des compétences d'effets de glissement d'album_javascript
Comment utiliser :
Citer respectivement les fichiers css et js, tels que :
<link rel="stylesheet" type="text/css" href="css/photoSlider.min.css" /> <script src="js/photoSlider.min.js" type="text/javascript" charset="utf-8"></script>
html :
<li><a href="/"><img src="img/1.jpg" /></a></li> <li><a href="/"><img src="img/2.jpg" /></a></li> <li><a href="/"><img src="img/3.jpg" /></a></li>
javascript :
window.onload=function(){ photoSlide({ wrap: document.getElementById('photo'),//最外层容器 loop: true,//设置无缝循环 autoPlay:true,//自动轮播 autoTime:4000,//轮播时间间隔 pagination:true //点状态列表 }); }
Exemple complet :
photoSlider-纯js移动开发轮播图、相册滑动插件 <li><a href="/"><img src="img/1.jpg" /></a></li> <li><a href="/"><img src="img/2.jpg" /></a></li> <li><a href="/"><img src="img/3.jpg" /></a></li>
Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.