已解决参考https://github.com/avinoamr/bootstrap-carousel-swipe
嘿伙计们，我正在尝试为我的小型企业设计一个网站..我的主要目标是为我的引导程序自定义轮播添加滑动支持。我找到了几个答案，但我似乎无法让它在我的旋转木马上工作。经过一个小时的反复试验，我寻求一些建议......
我错过了什么？预先感谢您的帮助！
更新我仍然试图让它发挥作用。香港专业教育学院尝试使用jquery cdn而不是本地文件..我总是尝试使用hammer.js方法。我想到也许div覆盖停止它，所以我删除了那些没有成功的测试目的..我也尝试删除数据间隔没有成功....再次任何帮助将不胜感激谢谢。
/ *我的轮播HTML * /
<div class="carousel fade-carousel slide" data-ride="carousel" data-interval="10000" id="bs-carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#bs-carousel" data-slide-to="0" class="active"></li>
<li data-target="#bs-carousel" data-slide-to="1"></li>
<li data-target="#bs-carousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item slides active">
<!-- Overlay -->
<div class="overlay"></div>
<div class="slide-1" role="img" aria-label="Shingle Roofing Free Estimates Licensed Bonded Insured"></div>
<div class="hero">
<header>
<h1>Shingle Roofing</h1>
<h3>"Get the Estimate You Deserve!"</h3>
</header>
<a href="tel:+12178207597" class="btn btn-hero btn-lg" role="button">Call Now (217) 820-7597</a>
</div>
</div>
<div class="item slides">
<!-- Overlay -->
<div class="overlay"></div>
<div class="slide-2" role="img" aria-label="Metal Roofing Free Estimates Licensed Bonded Insured"></div>
<div class="hero">
<header>
<h1>Metal Roofing</h1>
<h3>"Get the Estimate You Deserve!"</h3>
</header>
<a href="tel:+12178207597" class="btn btn-hero btn-lg" role="button">Call Now (217) 820-7597</a>
</div>
</div>
<div class="item slides">
<!-- Overlay -->
<div class="overlay"></div>
<div class="slide-3" role="img" aria-label="Rubber Roofing Free Estimates Licensed Bonded Insured"></div>
<div class="hero">
<header>
<h1>Rubber Roofing</h1>
<h3>"Get the Estimate You Deserve!"</h3>
</header>
<a href="tel:+12178207597" class="btn btn-hero btn-lg" role="button">Call Now (217) 820-7597</a>
</div>
</div>
</div>
</div>
/ *幻灯片支持脚本* /
<script src="js/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function() {
$("#bs-carousel").swiperight(function() {
$(this).carousel('next');
});
$("#bs-carousel").swipeleft(function() {
$(this).carousel('prev');
});
});
</script>