我正在使用名为 BookBlock 的 jQuery 插件,可以在此处的 Codrops 演示中找到
我已经像上面的示例一样成功地添加了分页并将其更改为数字而不是点,但是我现在想知道是否可以将这些相同的数字添加到 URL 中?
例如www.site.com/page/4/并且如果用户访问该 URL,他们会在分页序列中自动翻转到该页面?
这是我当前的代码:
var Page = (function() {
var $container = $( '#bb-custom-grid' ); // Defines the area
return {
init : function() {
$container.find('div.bb-bookblock').each(function(){
var $bookBlock = $( this ),
// BookBlock Settings
bbs = $bookBlock.bookblock( {
speed : 800,
perspective : 2000,
shadowSides : 0.8,
shadowFlip : 0.4
});
// Next and Prev Arrows
var $navNexts = $bookBlock.find( '.prev-arrow' ),
$navPrevs = $bookBlock.find( '.next-arrow' ).hide();
$navNexts.on( 'click', function() {
bbs.next();
return false;
} );
$navPrevs.on( 'click', function() {
bbs.prev();
return false;
} );
// Pagination
$('ul.numbered-pagination .end.page').attr('data-page-id',bbs.$items.length);
$.each( bbs.$items, function( key, value ) {
var classes = 'page';
if(key==0){
classes = 'active page';
}
$('<li class="'+classes+'" data-page-id="'+(key+1)+'">'+(key+1)+'</li>').insertBefore('ul.numbered-pagination .end.page');
$('ul.numbered-pagination li.page').on( 'click', function() {
bbs.jump(parseInt($(this).attr('data-page-id')));
$('ul.numbered-pagination .page').removeClass('active');
$(this).addClass('active');
});
});
// Swiping Action
$bookBlock.children().on( {
'swipeleft' : function( event ) {
bbs.next();
return false;
},
'swiperight' : function( event ) {
bbs.prev();
return false;
}
} );
});
}
};
})();
}
任何帮助将不胜感激!即使它只是解释为什么这可能是不可能的:)谢谢