类似于阿里云首页banner的实现

https://www.aliyun.com/阿里云地址

实现技术http://www.swiper.com.cn/和http://www.jq22.com/jquery-info178

 核心代码

 // swiper首页banner
  var swiperBanner = new Swiper('#banner .swiper-container', {
    spaceBetween: 30,
    effect: 'fade',
    pagination: {
      el: '#banner .swiper-pagination',
      clickable: true,
      renderBullet: function (index, className) {
        return '<span class="' + className + '"><span class="dot"></span></span>';
      },
    },
    on: {
    slideChangeTransitionStart: function(){
      // parallax(视觉差)
var scene=$("#banner .container .swiper-slide-active .concept_image .scene");
scene.each(function () {
    var parallaxInstance = new Parallax(this);
});
    }
    }

  });

注意要初始一次

var scene=$("#banner .container .swiper-slide-active .concept_image .scene");
    scene.each(function () {
        var parallaxInstance = new Parallax(this);
});