Framework7 List Views-Swipeout - Framework7

What is swipeout in Framework7?

Description

Swipeout allows the user to disclose unknown menu actions by swiping over the list elements. Swipeout is an extension of list view.

Swipeout Classes

Below table shows list of classes used in swipeout:

S.N.

Class & Description

1

swipeout-content
swipeout-content is the wrapper for the list element and it will move when the list item is swipped over.

2

swipeout-actions-left
swipeout-actions-left is a container which consists of left swipeout action buttons/links.

3

swipeout-actions-right
swipeout-actions-right is a container which consists of right swipeout action buttons/links.

4

swipeout-close
swipeout-close is an additional class on swipeout link and is used for closing swipeout element by clicking on this link.

Swipeout-content and swipeout-actions-left/right should be direct children of <li>

Swipeout Types

Below table shows the swipeout types used in Framework7:

S.N.

Type & Description

1

Swipeout Basic
A basic swipeout consists ofswipeout-contentwrapper and action buttons/links.

2

Swipe To Delete
User can useswipeout-deleteclass for deleting the swipeout action buttons.

3

Overswipe
Overswipeactions will be automatically triggered when the user does too many swipe actions.

4

Swipeout JavaScript API
swipeout provide JavaScript API for controlling the swipeout elements

5

Swipeout events
User can use swipeout events for detecting how the user interacts with the swipeout.

All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Framework7 Topics