Parameters
Parameters are added to the <fsi-image-twins-game> tag.
<body>
<fsi-image-twins-game dir="images/"
width="100%" height="100%"
spacing="20" naturalrotation="60"
columns="6" rows="6">
</fsi-image-twins-game>
</body>
debug
boolean
falseDefaultDisplay debug and status information in the browser's javascript console.
format
string
autoDefaultDefault is auto which automatically chooses the best format depending on the browser; alternatively you can choose WEBP, JPEG, PNG or GIF. Auto delivers the images adaptively
as WEBP in supporting browsers, and switches to PNG or JPEG on browsers not supporting the format. If you would like to use WEBP, the best way would be to set auto as the format.
dir
string
Defines the directory path which contains the images used for the game.
autoInit
boolean
trueDefaultPrevents automatic initialisation when the instance has been attached to the DOM. Helpful e.g. when working with React.
timeCardsVisible
integer
700DefaultDelay in ms before uncovered cards will be covered again.
cardBackImage
string
noneDefaultPath to an image to display as the back of the cards or none for no image.
cardBackImageCropAlign
string
ccDefaultDefines which part of the background image will be used.
The first character specifies the horizontal alignment:
l = left | c = center | r = right | v = random.
The second character specifies the vertical alignment:
t = top | c = center | b = bottom | v = random.
cardBackImageEffects
string
Server side image effects to apply to the card background image.
cropAlign
string
ccDefaultDefines which part of the images will be used for the cards.
The first character specifies the horizontal alignment:
l = left | c = center | r = right | v = random.
The second character specifies the vertical alignment:
t = top | c = center | b = bottom | v = random.
imagemargin
integer
6DefaultSpacing between the image and the edges of the card in px.
naturalrotation
float
3DefaultRandom rotation of the images/cards in degree.