Bootstrap Carousel을 사용하고 있습니다. 내가 원하는 것은 내비게이션 또는 페이지 매김을 클릭 할 때만 슬라이더가 미끄러지는 것입니다. 나는 제거를 시도했다
$('.carousel').carousel({
interval: 6000
});
잘 작동하지만 내 문제는 이미 탐색 또는 페이지 매김을 클릭하면 이제 자동 슬라이딩입니다. 자동 슬라이딩 기능을 제거 할 수 있습니까? 그렇다면 어떻게?
답변
js 또는 html (easist)을 통해 두 가지 방법으로 수행 할 수 있습니다.
- js를 통해
$('.carousel').carousel({
interval: false,
});
밀리 초가 추가되지 않고 다음으로 슬라이더가 이동하지 않기 때문에 자동 슬라이딩이 중지됩니다.
- Html 을 통해 추가
data-interval="false"
및 제거data-ride="carousel"
<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
된다 :
<div id="carouselExampleCaptions" class="carousel slide" data-interval="false">
@webMan의 댓글에 따라 업데이트 됨
답변
로부터 공식 문서 :
간격 항목 자동 순환 사이의 지연 시간입니다. 경우 거짓 , 회전 목마가 자동으로 순환하지 않습니다.
이 값은 javascript 또는 data-interval="false"
속성을 사용하여 전달할 수 있습니다 .
답변
DIV 태그에 속성을 하나 더 추가하면됩니다.
data-interval="false"
JS를 만질 필요가 없습니다!
답변
캐 러셀 div에서 data-interval = “false”로 변경 / 추가
<div class="carousel slide" data-ride="carousel" data-type="multi" data-interval="false" id="myCarousel">
답변
다음을 시도하십시오 :
<script>
$(document).ready(function() {
$('.carousel').carousel('pause');
});
</script>
답변
data-interval = “false”
이것을 해당 div에 추가하십시오 …
답변
$(document).ready(function() {
$('#media').carousel({
pause: true,
interval: 40000,
});
});
위의 스크립트를 사용하면 이미지를 자동으로 이동할 수 있습니다.
$(document).ready(function() {
$('#media').carousel({
pause: true,
interval: false,
});
});
위의 스크립트를 사용하면 auto-rotation
차단 interval
됩니다.false