Як зробити привабливий чекліст з перегортанням свайпамі.

Якщо ви бажаєте зробити чекліст (контрольний список), то ви можете використовувати Swipe-Li.

опис

Подивитися, як це працює в живу, ви можете тут:

Подивитися Демо

Даний чекліст не тільки красивий і витончений, але ще і переключається свайпамі, в чому його особливість.

А знайти вихідні коди ви можете тут:

Завантажити вихідні Swipe-Li

Відео: Що таке чек лист Детальна інструкція

Правда, у даній бібліотеки є залежності:

JQuery
AngularJS
Angular-touch
HammerJS
Modernizr

Завантажити все це ви можете, використовуючи Bower.

bower install swipe-li --save І залежно

bower_components/jquery/dist/jquery.js 
bower_components/modernizr/modernizr.js 
bower_components/angular/angular.js 
bower_components/hammerjs/hammer.js 
bower_components/angular-touch/angular-touch.js 
bower_components/dist/swipe-li.css 
bower_components/dist/swipe-li.min.js

Вам також слід оголосити залежність SwipeLi модуля.

angular.module(`MyApp`,[`SwipeLi`]) -

Директива

створіть директиву

 
swipe-li 
class="Item" 
disabled="" 
intent="True" 
accept="Done (item)" 
reject="Skip (item)" 
main-content=" `Sample-content.html`" 
accept-content=" `Accept-content.html`" 
reject-content=" `Reject-content.html`" 
reset-to-content="False" 
gt;

Розробка

встановіть залежності $ Npm install
$ Gulp dev запустіть простий node сервер і дивіться за змінами
Перейдіть за посиланням http: // localhost: 3000 /, щоб подивитися роботу програми