Maison >interface Web >js tutoriel >Basé sur le code Jquery pour prendre en charge les diaporamas PC et téléphones mobiles code_jquery

Basé sur le code Jquery pour prendre en charge les diaporamas PC et téléphones mobiles code_jquery

WBOY
WBOYoriginal
2016-05-16 15:31:361362parcourir

Partagez un code de diaporama prenant en charge les PC et les téléphones mobiles. Il prend en charge le toucher mobile, la commutation par glisser-déposer de la souris et le mode de lecture automatique avec barre de progression. Le diagramme de résultats croisés est le suivant :

Démonstration d'effet Téléchargement du code source

code html :

<div class="flex">
    <ul class="slides">
      <li data-title="Slide 1">
        <img alt="" src="img/beasts_feature.jpg">
      </li>
      <li data-title="Slide 2">
        <img alt="" src="img/element-taiwan-thmb.jpg">
      </li>
      <li data-title="Slide 3">
        <img alt="" src="img/streets-newyork.jpg">
      </li>
    </ul>
  </div>
  <script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
  <script type="text/javascript" src="js/jflex.min.js"></script>
  <script type="text/javascript">
    $('.flex').jFlex({
      autoplay: true
    });
  </script>
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