Using CAYIN Media Player in HTML > Image Slide Show Tag and Attributes

Image Slide Show Tag and Attributes

You can also use Image Slideshow tag to create an image area in you HTML page. Please refer to the tables and examples in the following sections.

HTML Code

1
2
3
4
5
<object type="TYPE Attribute" height=" Object height (pixel)" width=" Object width (pixel)">
<param name="NAME Attribute " value=" value ">
<param name="NAME Attribute " value=" value ">
<param name="NAME Attribute " value=" value ">
</object">
Back to Top

TYPE Attribute

Attribute Attribute Value Note
Type app/cayin-image You can create Image slideshow zone by creating this type of plug-ins.
Back to Top

NAME Attribute

Attribute Attribute Value Note
src

play-local-all

play-local-schedule-1

play-local-schedule-2

play-server-schedule-1
play-server-schedule-2
file://folder/image.jpg
file://folder2/

Image source attribute:
play-local-all: Play all files in the Media Folder.
play-local-schedule-x: follow local schedule zone 1 or 2
play-server-schedule-x: follow central schedule zone 1 or 2
file: you can specify files or a folder to play all image files in the folder.
duration [0-9]* Duration of displaying each image.
The default value of duration is 3.
sequence Forward
Backward
Random
Sequence
recursive 0/Disable/No
1/Enable/Yes
Include sub-folders
scale_fit 0
1
2
Scale to fit area
0: Disable
1: Fit to area (Proportional)
2: Fit to area (Non-Proportional)
transition_effect 0
1~50
255
0: No effect (default)
Check the complete list of image transition effects

Complete List of Image Transition Effects

Code Name Code Name
0
No effect
26
Squeeze – Vertical
1
Wipe Right (*1)
27
Squeeze – Horizontal
2
Wipe Left (*2)
28
Expand – Vertical
3
Wipe Down (*3)
29
Expand – Horizontal
4
Wipe Up (*4)
30
1 Clockwise Rotation
5
Insert Right
31
2 Clockwise Rotations
6
Insert Left
32
3 Clockwise Rotations
7
Insert Down
33
4 Clockwise Rotations
8
Insert Up
34
8 Clockwise Rotations
9
Fade Out + Fade In
35
Push Right
10
Fade In
36
Push Left
11
Unfold – Right
37
Push Down
12
Unfold – Left
38
Push Up
13
Unfold – Down
39
Wipe Right – Soft Edge
14
Unfold – Up
40
Wipe Left – Soft Edge
15
Fly In – Right Down
41
Wipe Down – Soft Edge
16
Fly In – Left Down
42
Wipe Up – Soft Edge
17
Fly In – Left Up
43
Windshield Wiper
18
Fly In - Right Up
44
4 Windshield Wipers
19
Rotate In
45
Checkerboard – Large
20
Horizontal Blinds
46
Checkerboard – Small
21
Vertical Blinds
47
Tetris – Large
22
Box Out
48
Tetris – Small
23
Box In
49
Dissolve – Large
24
Circle Out
50
Dissolve – Small
25
Circle In
255
Random
*1: Change the transition effect name from "Left to right" to "Wipe Right".
*2: Change the transition effect name from "Right to left" to "Wipe Left".
*3: Change the transition effect name from "Top to bottom" to "Wipe Bottom".
*4: Change the transition effect name from "Bottom to top" to "Wipe Top".
Back to Top

Example

Play the image files in the Media Folder repeatedly

1
2
3
4
5
6
7
8
9
10
11
<html>
<head>
</head>
<body>
<object type="app/cayin-image" width="320" height="240">
<param name="src" value="file://folder/image1.jpg">
<param name="src" value="file://folder/image2.jpg">
<param name="src" value="file://folder/image3.jpg">
</object>
</body>
</html>
Back to Top