Basierend auf Jquery-Code zur Unterstützung von PC- und Mobiltelefon-Diashows code_jquery

Teilen Sie einen Diashow-Code, der PC und Mobiltelefone unterstützt. Er unterstützt mobile Berührung, Maus-Drag-and-Drop-Umschaltung und automatischen Wiedergabemodus mit Fortschrittsbalken. Das Kreuzergebnisdiagramm sieht wie folgt aus:

Effektdemonstration Quellcode-Download

HTML-Code:

<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>