67 lines
2.1 KiB
JavaScript
67 lines
2.1 KiB
JavaScript
$(function() {
|
|
var mySwiper = new Swiper ('.swiper-container', {
|
|
direction: 'horizontal',
|
|
loop: true,
|
|
|
|
// 如果需要分页器
|
|
pagination: {
|
|
el: '.swiper-pagination'
|
|
},
|
|
|
|
// 如果需要前进后退按钮
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev'
|
|
},
|
|
|
|
// 如果需要滚动条
|
|
scrollbar: {
|
|
el: '.swiper-scrollbar'
|
|
}
|
|
});
|
|
|
|
$.scrollify({
|
|
section:".panel",
|
|
interstitialSection:"#layout-page-header,#layout-page-footer",
|
|
scrollbars:false,
|
|
before:function(i,panels) {
|
|
var ref = panels[i].attr("data-section-name");
|
|
$(".pagination .active").removeClass("active");
|
|
$(".pagination").find("a[href=\"#" + ref + "\"]").addClass("active");
|
|
$('.swiper-container').height('100%');
|
|
$('section.panel div.container').each(function(elem){
|
|
$(this).css({position: 'relative', top: ($(window).height() -$(this).height()) / 2 });
|
|
});
|
|
},
|
|
afterRender:function() {
|
|
var pagination = "<div class=\"pagination\">";
|
|
var activeClass = "";
|
|
$(".panel").each(function(i) {
|
|
activeClass = "";
|
|
if(i===0) {
|
|
activeClass = "active";
|
|
}
|
|
pagination += "<a class=\"" + activeClass + "\" href=\"#" + $(this).attr("data-section-name") + "\"><span class=\"hover-text\">" + $(this).attr("data-section-name") + "</span></a>";
|
|
});
|
|
|
|
pagination += "</div>";
|
|
|
|
$(".home").append(pagination);
|
|
/*
|
|
|
|
Tip: The two click events below are the same:
|
|
|
|
$(".pagination a").on("click",function() {
|
|
$.scrollify.move($(this).attr("href"));
|
|
});
|
|
|
|
*/
|
|
$(".pagination a").on("click",$.scrollify.move);
|
|
}
|
|
});
|
|
|
|
$('section.panel div.container').each(function(elem){
|
|
$(this).css({position: 'relative', top: ($(window).height() -$(this).height()) / 2 });
|
|
});
|
|
});
|