제가 책장 넘기는 어떤 스크립트를 사용해서 페이지를 만들었는데요
페이지를 넘기는 버튼이 다음과 같이 아래에 있습니다.
내용내용내용
<nav>
<a id="bb-nav-prev" href="#" class="bb-custom-icon bb-custom-icon-arrow-left">Previous</a>
<a id="bb-nav-next" href="#" class="bb-custom-icon bb-custom-icon-arrow-right">Next</a>
</nav>
그리고 아래에는 다음과 같은 자바스크립트가 있습니다.
Copy
<script>
var Page = (function() {
var config = {
$bookBlock : $( '#bb-bookblock' ),
$navNext : $( '#bb-nav-next' ),
$navPrev : $( '#bb-nav-prev' ),
$navFirst : $( '#bb-nav-first' ),
$navLast : $( '#bb-nav-last' )
},
init = function() {
config.$bookBlock.bookblock( {
speed : 800,
shadowSides : 0.8,
shadowFlip : 0.7
} );
initEvents();
},
initEvents = function() {
var $slides = config.$bookBlock.children();
// add navigation events
config.$navNext.on( 'click touchstart', function() {
config.$bookBlock.bookblock( 'next' );
return false;
} );
config.$navPrev.on( 'click touchstart', function() {
config.$bookBlock.bookblock( 'prev' );
return false;
} );
config.$navFirst.on( 'click touchstart', function() {
config.$bookBlock.bookblock( 'first' );
return false;
} );
config.$navLast.on( 'click touchstart', function() {
config.$bookBlock.bookblock( 'last' );
return false;
} );
// add swipe events
$slides.on( {
'swipeleft' : function( event ) {
config.$bookBlock.bookblock( 'next' );
return false;
},
'swiperight' : function( event ) {
config.$bookBlock.bookblock( 'prev' );
return false;
}
} );
// add keyboard events
$( document ).keydown( function(e) {
var keyCode = e.keyCode || e.which,
arrow = {
left : 37,
up : 38,
right : 39,
down : 40
};
switch (keyCode) {
case arrow.left:
config.$bookBlock.bookblock( 'prev' );
break;
case arrow.right:
config.$bookBlock.bookblock( 'next' );
break;
}
} );
};
return { init : init };
})();
그런데 페이지를 넘기는 버튼을 컨텐츠의 위, 아래 두번 놓고 싶어서
<nav>
<a id="bb-nav-prev" href="#" class="bb-custom-icon bb-custom-icon-arrow-left">Previous</a>
<a id="bb-nav-next" href="#" class="bb-custom-icon bb-custom-icon-arrow-right">Next</a>
</nav>
이 소스를 위쪽에다가 그대로 복사해서 썼더니
위쪽은 먹는데
아래쪽은 다음으로 가는 버튼이 먹지 않습니다.
짐작컨데 두번 나와서 그러지 않나 싶습니다.
페이지 이동하는 자바스크립트를 향한 버튼을 위아래 두번 사용하고 싶은데
방법이 없을까요?
|
답변 2개
채택된 답변
+20 포인트
RYANRYAN
1년 전
class 형태로 사용.
Copy
//상단코드 생략
var Page = (function() {
var config = {
$bookBlock : $( '#bb-bookblock' ),
$navNext : $( '.bb-nav-next' ), // 클래스 이름을 사용하여 위아래에 있는 모든 버튼을 선택
$navPrev : $( '.bb-nav-prev' ), // 클래스 이름을 사용하여 위아래에 있는 모든 버튼을 선택
$navFirst : $( '.bb-nav-first' ), // 클래스 이름을 사용하여 위아래에 있는 모든 버튼을 선택
$navLast : $( '.bb-nav-last' ) // 클래스 이름을 사용하여 위아래에 있는 모든 버튼을 선택
},
//하단코드 생략
1년 전
id를 class로 변경해보셔요
답변을 작성하려면 로그인이 필요합니다.