swiper轮播箭头垂直居中
Posted gduf
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了swiper轮播箭头垂直居中相关的知识,希望对你有一定的参考价值。
取消懒加载
if ($(‘#gallery‘).length != 0) {
$(‘#gallery img‘).removeClass(‘lazyload‘).attr(‘src‘,$(‘#gallery img‘).attr(‘data-src‘));
}
if ($(‘#s7thumbs‘).length != 0) {
$(‘#s7thumbs img‘).removeClass(‘lazyload‘).attr(‘src‘,$(‘#s7thumbs img‘).attr(‘data-src‘));
}
//轮播箭头垂直居中
function reactive_gallary_arrow_top($swiper) {
var outerHeight = $($swiper).find(".swiper-wrapper").height();
var imgHeight = $($swiper).find(".swiper-slide").find("img").height();
var percentage = 0.5*imgHeight/outerHeight * 100;
var prevArrow = $($swiper).find(".prev");
var nextArrow = $($swiper).find(".next");
prevArrow.css({
"top": percentage + ‘%‘
});
nextArrow.css({
"top": percentage + ‘%‘
});
}
//swiper调用
on: {
imagesReady:function () {
reactive_gallary_arrow_top(‘#p01-s5‘);
},
resize:function () {
reactive_gallary_arrow_top(‘#p01-s5‘);
}
}
以上是关于swiper轮播箭头垂直居中的主要内容,如果未能解决你的问题,请参考以下文章