0

slick

你需要的最后一个轮播。(the last carousel you'll ever need.)

官方網站
Github 資源庫
主要指標

Github星跟蹤圖

你需要的最后一个轮播。

slick特性：

  • 充分响应。 用它的容器称。
  • 每个断点单独设置
  • 在可用时使用CSS3。 不完全功能。
  • 已启用滑动。 或禁用，如果你喜欢。
  • 桌面鼠标拖动
  • 无限循环。
  • 可通过箭头键导航完全访问
  • 添加，删除，过滤和过滤幻灯片
  • 自动播放，点，箭头，回调等...
浏览器支持
  • Slick适用于IE8 +以及其他现代浏览器，如Chrome，Firefox和Safari。
依赖
  • jQuery 1.7+

主要指標

概覽
名稱與所有者kenwheeler/slick
主編程語言JavaScript
編程語言Makefile (語言數: 7)
平台Cross-platform, Web browsers
許可證MIT License
所有者活动
創建於2014-03-24 02:10:05
推送於2025-10-16 12:56:57
最后一次提交2025-10-16 15:56:57
發布數51
最新版本名稱v1.8.1 (發布於 2017-10-03 13:49:29)
第一版名稱1.0.0 (發布於 )
用户参与
星數28.6k
關注者數539
派生數5.8k
提交數1k
已啟用問題?
問題數3621
打開的問題數1187
拉請求數264
打開的拉請求數168
關閉的拉請求數279
项目设置
已啟用Wiki?
已存檔?
是復刻?
已鎖定?
是鏡像?
是私有?

slick

the last carousel you'll ever need

Demo

http://kenwheeler.github.io/slick

CDN

To start working with Slick right away, there's a couple of CDN choices availabile
to serve the files as close, and fast as possible to your users:

Example using jsDelivr

Just add a link to the css file in your <head>:

<!-- Add the slick-theme.css if you want default styling -->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
<!-- Add the slick-theme.css if you want default styling -->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css"/>

Then, before your closing <body> tag add:

<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>

Package Managers

# Bower
bower install --save slick-carousel

# NPM
npm install slick-carousel

Contributing

PLEASE review CONTRIBUTING.markdown prior to requesting a feature, filing a pull request or filing an issue.

Data Attribute Settings

In slick 1.5 you can now add settings using the data-slick attribute. You still need to call $(element).slick() to initialize slick on the element.

Example:

<div data-slick='{"slidesToShow": 4, "slidesToScroll": 4}'>
  <div><h3>1</h3></div>
  <div><h3>2</h3></div>
  <div><h3>3</h3></div>
  <div><h3>4</h3></div>
  <div><h3>5</h3></div>
  <div><h3>6</h3></div>
</div>

Settings

Option