Slider with one image and thumbs operating as numbers.
Animation speed [speed]
Progress increment for an animation frame.
Valid values: 1 - 100
Default: 10
Idle seconds [idle_secs]
Seconds of user inactivity until the system automatically shows the next image.
To disable the automatic advancement to the next image, set it to 0.
Default: 10
Width [width]
The container width in pixels.
If this field is not set, the system will use the width of its environment.
Height [height]
The container height in pixels.
If this field is not set, the system will use the height of the largest element in the image list.
CSS class - Container [class_container]
Sets the CSS class for the container of the image gallery.
If not set, the system will use "ps_viewer_slideone_tna".
CSS class - Panel [class_panel]
Sets the CSS class for the panel that works as a wrapper for each element.
If not set, the system will use "ps_viewer_slideone_tna_panel".
CSS class - Image [class_img]
Sets the CSS class for the image tag of each element.
If not set, the system will use "ps_viewer_slideone_tna_img".
CSS class - Button [class_button]
Sets the CSS class for each button in the thumbnail bar.
If not set, the system will use "ps_viewer_slideone_tna_button".
Notice: The system uses a different CSS class for the button that represents the current image. It automatically adds a "_sel" to the CSS class for the regular button. So, for example, if the CSS class for the regular button is "ps_viewer_slideone_tna_button" the system automatically creates the class "ps_viewer_slideone_tna_button_sel". And if the CSS class for the regular button is "my_class" the system automatically creates the class "my_class_sel".
Thumbnail bar position [thumb_position]
• Hide [hide] Hides the thumbnail bar.
• Top - Left [top_left] Shows the thumbnail bar in the top-left corner of the gallery container.
• Top - Right [top_right] Shows the thumbnail bar in the top-right corner of the gallery container.
• Bottom - Left [bottom_left] Shows the thumbnail bar in the bottom-left corner of the gallery container.
• Bottom - Right [bottom_right] Shows the thumbnail bar in the bottom-right corner of the gallery container.
Thumbnail bar offset X [thumb_offset_x]
The X offset, in pixels, of the thumbnail bar from the edge of the container.
Default: 10
Thumbnail bar offset Y [thumb_offset_y]
The Y offset, in pixels, of the thumbnail bar from the edge of the container.
Default: 10
This viewer needs some support from CSS. Here is an example set up:
.ps_viewer_slideone_tna_panel { text-align: center; } .ps_viewer_slideone_tna_button, .ps_viewer_slideone_tna_button_sel { display: inline; margin-left: 5px; border: 1px solid #b6d169; background-color: #738f22; padding: 2px 5px 2px 7px; color: #fff; font-size: 12px; } .ps_viewer_slideone_tna_button_sel { border: 1px solid #fff; } .ps_viewer_slideone_tna_button:hover, .ps_viewer_slideone_tna_button_sel:hover { background-color: #607620; }