recherche

Maison >interface Web >js tutoriel >Native js implémente des images de carrousel de développement mobile et des compétences d'effets de glissement d'album_javascript

Native js implémente des images de carrousel de développement mobile et des compétences d'effets de glissement d'album_javascript

WBOY
WBOYoriginal
2016-05-16 16:03:211553parcourir

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.

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
Article précédent：Méthode JavaScript pour contrôler le défilement fluide des pages Web jusqu'à la position des compétences elements_javascript spécifiéesArticle suivant：Méthode JavaScript pour contrôler le défilement fluide des pages Web jusqu'à la position des compétences elements_javascript spécifiées

Articles Liés

Voir plus