wecodeio/minimal-carousel

语言: JavaScript

git: https://github.com/wecodeio/minimal-carousel

简约的旋转木马。没有jQuery
A minimalist carousel. No jQuery
README.md (中文)

最小的旋转木马

简约的旋转木马。没有jQuery。

演示

现场直播!

选项

  • carousel:轮播容器的css选择器。默认为.carousel
  • 延迟:幻灯片之间的延迟(秒)。默认为2.5秒
  • 自动播放:是否自动播放。默认为true

用法

HTML

<div class="carousel">
  <ul>
    <li>
      First impressive message!
    </li>
    <li>
      Second message with all the magic
    </li>
    <li>
      Also, you can configure minimal carousel as you want.
    </li>
  </ul>
</div>

CSS

.carousel ul li {
  display: none;
}

使用Javascript

new Carousel({
  carousel: '.carousel',
  delay: 2.5,
  autoplay: true
})

路线图

  • 简单的过渡
  • 轻松进出

特约

  1. 叉吧
  2. 创建您的功能分支(git checkout -b my-new-feature)
  3. 提交你的更改(git commit -am'添加一些功能')
  4. 推送到分支(git push origin my-new-feature)
  5. 创建新的Pull请求

本文使用googletrans自动翻译,仅供参考, 原文来自github.com

en_README.md

minimal carousel

A minimalist carousel. No jQuery.

Demo

See it live!

Options

  • carousel: css selector of carousel container. Defaults to .carousel
  • delay: delay between slides in seconds. Defaults to 2.5 secs
  • autoplay: whether or not it plays automaticaly. Defaults to true

Usage

HTML

<div class="carousel">
  <ul>
    <li>
      First impressive message!
    </li>
    <li>
      Second message with all the magic
    </li>
    <li>
      Also, you can configure minimal carousel as you want.
    </li>
  </ul>
</div>

CSS

.carousel ul li {
  display: none;
}

Javascript

new Carousel({
  carousel: '.carousel',
  delay: 2.5,
  autoplay: true
})

Roadmap

  • Simple transitions
  • Ease in/out

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request