홈>
과거에는 웹 디자이너 였지만 코드를 만진 지 몇 년이 지났습니다. 간단한 오류가 발생한다고 생각하지만 알아낼 수는 없습니다. 부트 스트랩 평가 텍스트 회전 목마를 포함하려고하는데 작동하지 않습니다. jQuery와 bootstrap.js는 작동하지만 회전 목마는 작동하지 않는 것 같습니다.
단기 페이지처럼 cdn을 사용하여 매우 간단하게 만들려고합니다. 또한 작동하지 않는 페이지의 관련 부분까지 모두 잘랐습니다. 문제를 해결하기 위해 무언가가 작동 할 때까지 조각을 제거하기 시작하지만 이번에는 찾을 수 없습니다. 도움을 주시면 감사하겠습니다!
<!DOCTYPE html>
회원 평가 / * 캐 러셀 */
#quote-carousel {
padding: 0 10px 30px 10px;
margin-top: 30px;
}
/* indicator position */
#quote-carousel .carousel-indicators {
right: 50%;
top: auto;
bottom: -10px;
margin-right: -19px;
}
/* indicator color */
#quote-carousel .carousel-indicators li {
background: #c0c0c0;
}
/* active indicator */
#quote-carousel .carousel-indicators .active {
background: #333333;
height: 10px;
width: 10px;
margin-bottom: 1px;
}
</style>
<!-- FANS-->
<section id="fans">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="p-5">
<img class="img-fluid rounded-circle" src="img/fans.png" alt="">
</div>
</div>
<div class="col-lg-6 order-lg-1">
<div class="p-5">
<h2 class="display-4">Fans</h2>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="carousel slide" data-ride="carousel" id="quote-carousel">
<!-- Bottom Carousel Indicators -->
<ol class="carousel-indicators">
<li data-target="#quote-carousel" data-slide-to="0" class="active"></li>
<li data-target="#quote-carousel" data-slide-to="1"></li>
<li data-target="#quote-carousel" data-slide-to="2"></li>
</ol>
<!-- Carousel Slides / Quotes -->
<div class="carousel-inner">
<!-- Quote 1 -->
<div class="item active">
<div class="row">
<div class="col-sm-12">
<p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Etiam porta sem malesuada magna mollis euismod. Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus.”</p>
<small><strong>Vulputate M., Dolor</strong></small>
</div>
</div>
</div>
<!-- Quote 2 -->
<div class="item">
<div class="row">
<div class="col-sm-12">
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.”</p>
<small><strong>Fringilla A., Vulputate Sit</strong></small>
</div>
</div>
</div>
<!-- Quote 3 -->
<div class="item">
<div class="row">
<div class="col-sm-12">
<p>“Aenean lacinia bibendum nulla sed consectetur. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Cras mattis consectetur purus sit amet fermentum.”</p>
<small><strong>Aenean A., Justo Cras</strong></small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Bootstrap core JavaScript-->
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
//carousel options
$('#quote-carousel').carousel({
pause: true,
interval: 10000,
});
});
</script>
- 답변 # 1
관련 자료
- javascript - React Hooks 및 Bootstrap에서 작동하지 않는 경고
- html - 모든 열에서 부트 스트랩 테이블 정렬이 작동하지 않음
- jquery - whitout 컨트롤을 클릭하면 부트 스트랩 회전 목마가 iOS에서 미끄러 져 움직입니다
- html - 부트 스트랩 캐 러셀 슬라이더가 올바르게 작동하지 않습니다
- html - 부트 스트랩 회전 목마 렌더링하지만 슬라이딩하지는 않습니다 왼쪽 오른쪽 아이콘도 작동하지 않습니다
- javascript - XML HttpRequest를 통해로드 할 때 OnClick () 함수가 작동하지 않음
- javascript - React JS에서 부트 스트랩 모달이 작동하지 않습니다
- reactjs - Reactstrap Bootstrap Navbar가 반응 앱에서 작동하지 않음
- 업데이트 된 부트 스트랩 젬을 레일에로드 할 수 없습니다
- styling - 반응 부트 스트랩 구성 요소가 제대로 작동하지 않습니다
- html - 부트 스트랩 비디오 슬라이드 쇼에서 로컬 파일을 사용하는 방법
- twitter bootstrap - bootsrap carousel이 각도 7에서 작동하지 않습니다
- css - Bootstrap Navigation과 Carousel을 100vh로 맞추려면 어떻게해야합니까?
- javascript - nav-tab이 내부에있을 때 부트 스트랩 스크롤 모달이 작동하지 않음
- jquery - 부트 스트랩 팝 오버 내부의 HTML 양식이 작동하지 않습니다
- html - 부트 스트랩 4 풀 오른쪽이 탐색 모음에서 작동하지 않습니다
- php - Larave 8에서 부트 스트랩 4 페이지 매김이 올바르게 작동하지 않음
- typescript - 여러 경로가 각도 10 지연로드 모듈에서 작동하지 않습니다
- python 3.x - Bootstrap 4를 사용하여 django에서 Dynamic Carousel을 만드는 방법
- html - 캐 러셀 상단의 버튼이 작동하지 않는 이유는 무엇입니까?
관련 질문
- javascript : JQuery로 클릭시 버튼의 배경색 변경이 작동하지 않습니다.
- javascript : html /css의 참조
- javascript : Chart.js : 분산 형 선 차트에서 "stacked"가 작동하지 않음
- javascript : Bootstrap 4 고정 Navbar를 아래로 내리고 스크롤시 단색이되도록합니다.
- javascript : 웹 페이지에서 JSON 값을 렌더링했으며 렌더링 된 JSON 값을 더하고 나누고 싶었습니다.
- javascript : Django는 jquery를 사용하여 텍스트 파일을 html 파일로로드합니다.
- javascript : jQuery를 통해 어떤 라디오 버튼이 선택되었는지 어떻게 알 수 있습니까?
- jQuery /JavaScript의 모든 HTML 요소에 대한 탭 누르기 처리
- javascript : HTML 및 JS로 양식을 이메일로 제출
- javascript : <비디오>모바일에서로드되지 않고 데스크톱에서 완벽하게 작동합니다.
회전식 항목의 클래스 이름은
carousel-item
입니다.item
가 아니라 . 따라서 모든 것을 변경해야합니다으로
<시간>일하는 바이올린
캐 러셀 참조-부트 스트랩