点击一组轮播中的某一张显示另一组轮播的问题

麦尼玛

一个页面有两组轮播a和b,页面初始化a显示，b隐藏；点击a之后，a隐藏，b显示；
点击b之后，b隐藏，a显示；

就是类似于手机淘宝商品宝贝详情页面那种效果

麦尼玛

/*点击轮播b*/
$("#shadow .swiper-slide").click(function(){
        var _len=$("#shadow .swiper-slide").length;                //图片的总数
        var _index=$(this).index();                             //当前图片的索引
        $("#shadow").addClass("fhidden");
        $("#main").removeClass("fhidden");
        $("#main .swiper-slide").eq(_index).addClass("swiper-slide-active");
});

/*点击轮播a*/
$("#main .swiper-slide").click(function(){
        var _len=$("#main .swiper-slide").length;                //图片的总数
        var _index=$(this).index();                             //当前图片的索引
        $("#main").addClass("fhidden");
        $("#shadow").removeClass("fhidden");
        $("#shadow .swiper-slide").eq(_index).addClass("swiper-slide-active");
});

麦尼玛

但是每次先前被隐藏后来被显示的一组轮播b，显示出来之后就不行了，只能手滑动多少，图片也跟着滑动多少距离，而不是稍微滑一下，一张图片就轻松滑过去了
一开始就显示的的轮播a照样好好的