pagination为不同的图片,可滑动,支持点击
var mySwiper = new Swiper(".swiper-container", { pagination: { el: ".swiper-pagination", type: 'custom', renderCustom:function(swiper,current,total){ var paginationHtml = ''; var text = ['等级专属券','免邮特权','生日礼券'] for(var i=1;i<=total;i++){ if(i==current){ paginationHtml+=`<div class='pagination pagination_active'> <span class='pagination_icon icon${i}'></span> <span class='pagination_text'>${text[i-1]}</span> </div>` }else{ paginationHtml+=`<div class='pagination'> <span class='pagination_icon icon${i}'></span> <span class='pagination_text'>${text[i-1]}</span> </div>` } }; return paginationHtml } }, hashNavigation: { watchState: true, }, clickable :true, }); $('.swiper-pagination').on('click','.pagination',function(){ var index = $(this).index(); mySwiper.slideTo(index, 1000, false); })
首先我们需要明白swiper 想要速度的效果是需要用到 transition-timing-function: 这个参数的 其次需要配合speed:1200,使用 lin
最后一屏底部自动高度的方法为 slidesPerView:auto, css代码 .foot{height:auto!important;} 但是这种情况会出现滚动到最后一屏的
slidesPerView:1,autoplay:3000,direction:vertical,grabCursor:true,autoplayDisableOnInteraction:false,mousewheelControl:true,autoHeight:true,//重点就是
直接鼠标hover模拟click即可! $(.swiper-pagination-bullet).hover(function(){$(this).click();//鼠标划上去之后,自动触发点击事件来
swiper嵌套的swiper怎样实现鼠标滚动切换,当嵌套的切换完之后,在继续切换外面的swiper !DOCTYPEhtml!--savedfromurl=(0044)ht