flickity fade

轻快褪色

Flickity 幻灯片之间的淡入淡出

安装

将flickity-fade.css添加到样式表中， flickity-fade.js到脚本中。

下载

• flickity-fade.css
• flickity-fade.js

CDN

 <!-- CSS -->
< link rel =" stylesheet " href =" https://unpkg.com/flickity-fade@2/flickity-fade.css " >

<!-- JS -->
< script src =" https://unpkg.com/flickity-fade@2/flickity-fade.js " > </ script >

包管理器

• npm： npm install flickity-fade
• 纱线： yarn add flickity-fade

用法

通过在 Flickity 选项中设置fade: true来启用淡入淡出行为。

 // jQuery
let $carousel = $ ( '.carousel' ) . flickity ( {
  fade : true ,
} ) ; 

 // vanilla JS
let flkty = new Flickity ( '.carousel' , {
  fade : true ,
} ) ; 

 <!-- HTML -->
< div class =" carousel " data-flickity =' { "fade": true } ' >
  ...
</ div >

网页包

 const Flickity = require ( 'flickity' ) ;
require ( 'flickity-fade' ) ;

let flkty = new Flickity ( '.carousel' , {
  fade : true ,
} ) ;

---

这个功能在功能请求炼狱中度过了四年。永不放弃。

通过Metafizzy？