Coder Social home page Coder Social logo

swiper's Introduction

Swiper - Mobile touch slider with hardware accelerated transitions

About

Swiper - is the free and ultra lightweight mobile touch slider with hardware accelerated transitions (where supported) and amazing native behavior. It is intended to use in mobile websites, mobile web apps, and mobile native apps. Designed mostly for iOS, but also works on Android and latest Desktop browsers. Swiper is created by iDangero.us

Features

  • 1:1 Touch movement. But this ratio can be configured

  • Touch emulation. This function will be useful if you are going to use Swiper on desktop sites. In this case Swiper will accept mouse events like touch events (click and drag to change slides)

  • Vertical/Horizontal. Swiper comes with 2 main modes - horizontal (for horizontal animation and horizontal swipes) and vertical (for vertical animation and vertical swipes)

  • Free Mode. When this mode enabled slides will not have fixed positions, like usual scroller (see demos bellow)

  • Rotation/resize adjustment. Swiper will be reinitialized after rotation of device

  • Responsive. Can be used with a width or/and height defined in percents, not fixed. Useful for usage on devices with a different resolutions

  • Scroll prevention. Swiper will prevent vertical scroll when you touch it in "horizontal" mode, and horizontal scroll in "vertical" mode

  • Resistant bounds. Swiper will increase resistance when you try to swipe it over than most left and most right positions (most top and most bottom for "vertical" mode)

  • Built-in pagination control. Can be disabled

  • Auto Play. Just set the delay and Swiper will change the slides automatically untill you touch it.

  • Loop mode. In this mode you will get infinite scrolling and first slides will repeat after last ones. New in 1.5

  • Carousel mode. Swiper allows you to set numbers of slides you want to display at the same time on slider's container. New in 1.5

  • Nested Swipers. You can insert one Swiper into slide of different Swiper, for example vertical into horizontal. New in 1.5

  • Any HTML. You can put any HTML content inside of slide, not only images

  • Rich API. Swiper comes with very rich API. It allows to create your own pagination, "next" and "previous" buttons and comes with 4 callbacks - onTouchStart, onTouchMove, onTouchEnd, onSlideSwitch

  • Flexible configuration. Swiper accepts a lot of parameters on initialization to make it much flexible as possible. You can configure animation speed, mode (vertical or horizontal), free mode, enable/disable pagination, touch ratio, etc.

  • Hardware accelerated. Swiper uses hardware accelerated technics (where supported) to achive ultra smooth animation and perfomance, especially on iOS devices.

  • Awesome compatibility. Swiper compatible and tested with: Mobile Safari (tested on iOS5), Android 2.1%2B, latest desktop versions of Google Chrome, Safari, Firefox, Internet Explorer 10 and Opera. It also works in Internet Explorer 9 but without animation.

  • Standalone. Swiper doesn't require any JavaScript libraries like jQuery, it makes Swiper much more smaller and faster. So it can be safely used with such libraries as jQuery, jQuery Mobile, jQTouch, etc.

  • Ultra lightweight. Only 3.2 KB minified and gzipped

With all these features you can build amazing touch interfaces and apps with awesome native behavior.

Demos & Usage

http://www.idangero.us/sliders/swiper/

License

Swiper is licensed under GPL & MIT

swiper's People

Contributors

nolimits4web avatar stephanebachelier avatar ekzobrain avatar andyburke avatar galcohen avatar baxang avatar girliemac avatar andreybs11 avatar evidica avatar x4arms avatar tremby avatar izifortune avatar tatumcreative avatar luads avatar mehernosh avatar seastland avatar dogoku avatar ccebrand avatar daleknauss avatar hiroqn avatar jamesryanbell avatar knusperpixel avatar mattdemps avatar wolffan avatar yukulele avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.