zoukankan      html  css  js  c++  java
  • swiper轮播箭头垂直居中

    取消懒加载


    for (var i in $('.p01-s9 .lazyload')) {
    $('.p01-s9 .lazyload').eq(i).attr('src',$('.p01-s9 .lazyload').eq(i).attr('data-src'));
    }
    $('.p01-s9 .lazyload').removeClass('lazyload').addClass('lazyloaded');


    //轮播箭头垂直居中
    function reactiveGallaryArrowTop($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(){

          reactiveGallaryArrowTop('#p01-s5');                    

                    }
                }

     
            $(window).resize(function () {
                reactiveGallaryArrowTop('.p11-1-s4');
            });
  • 相关阅读:
    python-登录小游戏
    easyclick 学习
    PYQT5 学习
    Pycharm之QT配置
    标贴打印机的基本使用
    开发遇到的问题及其解决
    Datatable 数据源
    JIRA操作之JQL
    类视图函数 VIEW
    前端基础
  • 原文地址:https://www.cnblogs.com/gduf/p/11679349.html
Copyright © 2011-2022 走看看