Question

我有一个使用引导旋转木马无法理解的问题。在移动设备上，我想通过滑动（而不是单击）进行滑动，并且在单击时出现一个pinterest按钮。我已停用了移动设备上的轮播控制按钮（请参见下面的CSS代码），并对pinterest按钮设置了jquery规则，它在android上完美运行。但是在ios上，单击时，轮播会滑动。

有什么想法吗？

我的代码

$('.carousel-item img').click(function() {
  $('.social-sharing').toggleClass('visible');
});
$("#carouselwork").on('slide.bs.carousel', function() {
  $('.social-sharing').removeClass('visible');
});

@media (max-width: 768px) {
  .social-sharing.visible {
    display: block;
  }
  .carousel-control {
    display: none;
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

<div id="carouselwork" class="carousel slide work-single" data-ride="carousel" data-interval="false">
  <div class="carousel-inner">
    <div class="carousel-item  active">
      <img src="..." alt="..." />
      <div class="social-sharing ss-social-sharing">
        <a onclick="return ss_plugin_loadpopup_js(this);" rel="external nofollow" class="ss-button-pinterest" href="..." target="_blank"></a>
      </div>
      <div class="img-work-caract">
        <p>the title</p>
        <div class="counter">1/<span class="total">2</span></div>
      </div>
    </div>
    <div class="carousel-item">
      <img src="..." alt="..." />
      <div class="social-sharing ss-social-sharing">
        <a onclick="return ss_plugin_loadpopup_js(this);" rel="external nofollow" class="ss-button-pinterest" href="..." target="_blank"></a>
      </div>
      <div class="img-work-caract">
        <p>the title</p>
        <div class="counter">2/<span class="total">2</span></div>
      </div>
    </div>
  </div>
  <a class="carousel-control-prev carousel-control" href="#carouselwork" role="button" data-slide="prev"></a>
  <a class="carousel-control-next carousel-control" href="#carouselwork" role="button" data-slide="next"></a>
</div>

谢谢！

Answer 1

这似乎是轮播引导程序中的错误。修补程序已部署在github的分支v4-jo-fix-carousel-click-slide

上

当单击WHITOUT控件时，引导轮播会在iOS上滑动

1 个答案: