Carrousel tap事件不工作

Carrousel tap event not working

本文关键字：工作 事件 tap Carrousel      更新时间：2023-09-26

我正在使用这个插件创建一个3D滑块。它在浏览器上运行良好。当你点击一张图片时，它会变成一张活动的幻灯片并位于中心。同样的行为（点击图像）在iPad上不起作用。我如何在iPad上解决这个问题？

插件HTML结构：

<link rel="stylesheet" href="css/carrousel.css"/>
<!-- ... -->
<div class="banner">
    <section id="dg-container" class="dg-container">
        <div class="dg-wrapper">
            <a href="#" link="http://www.anotherhome.net">
                <img src="images/1.jpg">
            </a>
            <a href="#" link="http://www.anotherhome.net">
                <img src="images/2.jpg">
            </a>
            <!-- ... -->
        </div>
        <ol class="button" id="lightButton">
            <li index="0">
            <li index="1">
            <!-- ... -->
        </ol>
        <nav>
            <span class="dg-prev"></span>
            <span class="dg-next"></span>
        </nav>
    </section>
</div>
<!-- ... -->
<script src="js/jquery.js"></script>
<script src="js/carrousel.js"></script>

以下是您实例化插件的方式：

$('#dg-container').carrousel({
    current: 0,
    autoplay: true,
    interval: 3000
});


<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>jCarrousel Demo</title>
  <link rel="stylesheet" href="https://www.anotherhome.net/file/jCarrousel/css/carrousel.css" />
</head>
<body>
  <div class="banner">
    <section id="dg-container" class="dg-container">
      <div class="dg-wrapper">
        <a href="#" link="http://www.anotherhome.net">
          <img src="https://www.anotherhome.net/file/jCarrousel/images/1.jpg">
        </a>
        <a href="#" link="http://www.anotherhome.net">
          <img src="https://www.anotherhome.net/file/jCarrousel/images/2.jpg">
        </a>
        <a href="#" link="http://www.anotherhome.net">
          <img src="https://www.anotherhome.net/file/jCarrousel/images/3.jpg">
        </a>
        <a href="#" link="http://www.anotherhome.net">
          <img src="https://www.anotherhome.net/file/jCarrousel/images/4.jpg">
        </a>
        <a href="#" link="http://www.anotherhome.net">
          <img src="https://www.anotherhome.net/file/jCarrousel/images/5.jpg">
        </a>
      </div>
      <ol class="button" id="lightButton">
        <li index="0">
          <li index="1">
            <li index="2">
              <li index="3">
                <li index="4">
      </ol>
      <nav>
        <span class="dg-prev"></span>
        <span class="dg-next"></span>
      </nav>
    </section>
  </div>
  <script src="https://www.anotherhome.net/file/jCarrousel/js/jquery.min.js"></script>
  <script src="https://www.anotherhome.net/file/jCarrousel/js/carrousel.js"></script>
  <script>
    $(function() {
      $('#dg-container').carrousel({
        current: 0,
        autoplay: true,
        interval: 3000
      });
    });
  </script>
</body>
</html>

这是网站上的示例代码
我添加了完整的链接，这样您就可以直接复制并粘贴到HTML文档中，而无需下载任何内容。我建议你复制&粘贴这个，然后只更改图像，因为当我在平板电脑上试用时，测试网站似乎可以工作
希望这能有所帮助！

相关文章：