光滑的轮播简化示例

本文介绍了光滑的轮播简化示例的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 我正在使用Slick Carousel（ http://kenwheeler.github.io/slick/ ） ，但不知道如何合并不同的幻灯片转换。有没有人有一个分享的例子？I am using Slick Carousel (http://kenwheeler.github.io/slick/), but don't know how to incorporate different slide transitions. Does anyone have an example to share?这是我目前所拥有的： $('.slider1').slick({ autoplay:true, autoplaySpeed: 4500, arrows:false, slide:'.slider-pic', slidesToShow:1, slidesToScroll:1, dots:false, easing: 'easeOutElastic', responsive: [ { breakpoint: 1024, settings: { dots: false } }] });现场 - http://lantecctc.businesscatalyst.com/推荐答案使用 cssEase 而不是缓和 - 这是浮油上的详细说明。 不确定是否允许'easeOutElastic';据我所知，slick使用标准的CSS3动画，而easeOutElastic不是受支持的值之一。您最近的选择可能是缓出： http：/ /www.w3schools.com/cssref/css3_pr_animation-timing-function.aspUse cssEase instead of easing - this is the notation detailed on slick.Not sure whether 'easeOutElastic' is allowed; as far as I'm aware slick uses standard CSS3 animations and easeOutElastic is not one of the supported values. Your closest option might be ease-out: http://www.w3schools.com/cssref/css3_pr_animation-timing-function.asp 从有用的评论中更新： useTransform：true 在某些情况下是必要的：Update from helpful comments:useTransform: trueis necessary for this to work in some cases:$('.slider1').slick({ useTransform: true, autoplay:true, autoplaySpeed: 4500, arrows:false, slide:'.slider-pic', slidesToShow:1, slidesToScroll:1, dots:false, cssEase: 'ease-out', responsive: [ { breakpoint: 1024, settings: { dots: false } }]});设置：cssEase，类型：字符串，默认值：'ease'，使用CSS3动画缓动 - http://kenwheeler.github.io/slick/setting: cssEase, type: string, default value: 'ease', uses CSS3 Animation Easing - http://kenwheeler.github.io/slick/ 这篇关于光滑的轮播简化示例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！