스와이퍼 슬라이드 버튼 작동이 안됩니다.. 채택완료
갤러리 게시판 view.skin.php에 스와이퍼 슬라이드를 쓰고싶습니다..!!
아래처럼 코드 수정하고 첫번째 첨부파일 제외한 나머지 첨부파일을 뜨게하는 것 까진 생각했던 대로 된 것 같은데 아무리 버튼을 누르고 새로고침하고 쿠키삭제하고 다시 누르고 해봐도 슬라이드가 작동을 안하네요ㅜㅜ 코드에 문제가 있는걸까요? 제이쿼리는 cdn으로 넣었습니다...
</p>
<p><div class="swiper v_more">
<div class="swiper-wrapper">
<?php
for ($i=1; $i<count($view['file']); $i++) {</p>
<p> // if($thumb['ori']) {
// $img = $thumb['ori'];
// } else {
// $img = G5_IMG_URL.'/no_img.png';
// $thumb['alt'] = '이미지가 없습니다.';
// }
?></p>
<p> <?php // 파일 출력
echo "<div class=\"swiper-slide\">\n";</p>
<p> $v_img_count = count($view['file']);
if($v_img_count) {
echo $view['file'][$i]['view'];
echo get_file_thumbnail($view['file'][$i]['view']);
$thumb = get_view_thumbnail($view['file'][$i]['view']);
}
echo "</div>\n";
?>
<?php } ?>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div></p>
<p>
</p>
<p><script>
var swiper = new Swiper('.v_more', {
initialSlide : 0,
slidesPerView: 'auto',
observer: true,
observeParents: true,
loop: true,
pagination: {
el: '.swiper-pagination',
type: 'fraction',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script></p>
<p>답변 1개
해당소스로 테스트해봤는데 정상적으로 버튼 작동 합니다.
버튼 영역 z-index한번 확인해보세요.
그리고 jquery 는 별다른 소스 수정을 하지 않았으면 기본적으로 로드가 됩니다.
설마 그게 아니겠지만 swiper js를 jquery 위에 선언하지 않았는지 확인도 해보심이.
무튼 소스는 정상입니다.
<div class="swiper v_more">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<script>
var swiper = new Swiper('.v_more', {
initialSlide : 0,
slidesPerView: 'auto',
observer: true,
observeParents: true,
loop: true,
pagination: {
el: '.swiper-pagination',
type: 'fraction',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script>
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인