Multi Cards
An ISLE component that allows you to create and control multiple flippable cards (e.g. in a game of Memory).
Options
- animation |
object
: if set the component uses an entry animation; the object contains a name (likeanim-scale-up
) and a duration (like1.7s
= 1.7 seconds). Default:{}
. - memory |
boolean
: whether to enable the memory game mode in which one has to match pairs of the supplied values. Default:none
. - onChange |
function
: a function that receives the matrix of the flippable cards. Default:onChange() {}
. - onMemoryComplete |
function
: callback invoked if the memory game is complete. Default:onMemoryComplete() {}
. - oneTime |
boolean
: indicates whether the flip process may be executed just once. Default:false
. - values |
array<object>
: the values for the respective cards, input in an array that has entry fields for afront
andback
value. Such a value could be a string, but also a full fledged ISLE component. Default:[]
. - style |
object
: CSS inline styles. Default:{}
. - containerStyle |
object
: CSS style of the card containers. Default:{}
. - frontStyle |
object
: CSS style of the front of the cards. Default:{}
. - backStyle |
object
: CSS style of the back of the cards. Default:{}
.
Examples
- Minimal
- Front Image
- Memory
- Memory with Solved Callback
Live Editor
Result
ReferenceError: Provider is not defined