채택완료
slick slider에 이미지대신 비디오mp4를 넣었는데 비디오 옵션인 controls가 사용불가하네요
slick slider에 이미지대신 비디오mp4를 넣었는데 비디오 옵션인 controls가 사용불가하네요
혹시 어디를 수정해여 controls가 보이게 되는지 알고싶어서 문의드립니다.
저화 같은 고민을 햇던분이 있을까요,
감가합니다
답변 2개 / 댓글 3개
채택된 답변
+20 포인트
Slick의 초기화 이후에 <video> 태그에 controls 속성을 강제로 추가하거나,
slick-slide가 활성화될 때 controls를 추가하는 이벤트 핸들러를 설정해야 합니다.
예를 들어, afterChange 이벤트를 활용하여
활성화된 슬라이드의 <video> 요소에 controls 속성을 추가하면 해결될 가능성이 큽니다.
jQuery 코드로 구현할 수 있을 것입니다.
$('.slider').on('init', function() {
$('.slick-slide video').attr('controls', 'controls');
});
$('.slider').slick();
Slick이 초기화된 후
비디오에 controls 속성을 직접 추가하는 것이 가장 적절한 방법입니다.
-구글링했습니다.
답변에 대한 댓글 2개
1. controls 옵션 추가:
Copy
javascript
$('.slider').slick({
controls: true,
...
});2. CSS에서 비디오 controls 스타일 지정:
css
Copy
.slick-slider .slick-video-controls {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}3. HTML에서 비디오 controls 추가:
html
Copy
<div class="slick-video-controls">
<button class="slick-prev">이전</button>
<button class="slick-next">다음</button>
</div>답변을 작성하려면 로그인이 필요합니다.