Skip to main content

Parameters

Parameters are added to the <fsi-image-twins-game> tag.

Example:
<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

Display debug and status information in the browser console
since 19.01

false
Default

Display debug and status information in the browser's javascript console.

format​

string

Defines the format used for the viewer
since 19.11

auto
Default

Default 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
since 19.01

Defines the directory path which contains the images used for the game.

language​

string

user interface language
since 19.01

Defines the language of the user interface.

autoInit​

boolean

Prevents automatic initialisation when the instance has been attached to the DOM
since 23.08

true
Default

Prevents automatic initialisation when the instance has been attached to the DOM. Helpful e.g. when working with React.

timeCardsVisible​

integer

time in ms before cards are covered again
since 19.01

700
Default

Delay in ms before uncovered cards will be covered again.

cardBackImage​

string

Path to an image to display as the back of the cards
since 19.01

none
Default

Path to an image to display as the back of the cards or none for no image.

cardBackImageCropAlign​

string

Defines which part of the background image will be used
since 19.01

cc
Default

Defines 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

card background effects
since 19.01

Server side image effects to apply to the card background image.

cropAlign​

string

part of the images which will be used for the cards
since 19.01

cc
Default

Defines 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.

effects​

string

card image effects
since 19.01

Image effects used for the card images.

columns​

integer

defines columns
since 19.01

1
Default

Number of images in a row.

rows​

integer

defines rows
since 19.01

1
Default

Number of images in a column.

imagemargin​

integer

spacing in px
since 19.01

6
Default

Spacing between the image and the edges of the card in px.

naturalrotation​

float

random rotation of images
since 19.01

3
Default

Random rotation of the images/cards in degree.

spacing​

integer

Spacing between cards
since 19.01

8
Default

Spacing between the cards in px.