Skip to content



In many scenarios, people want to show various pictures of things for specific items. Think about a product on Amazon that might have different pictures taken from different angles, think about an online real-estate broker presenting different houses with picture sets of the house on sale or a car dealer showing cars for sale accompanied by pictures of the car in various positions.

If you have such a use-case in your application, TWebImageSlider is the shortcut to achieve this. Basicaly this is a container control where you add the links to the images to be displayed and the control does everything else. It shows the picture thumbnails, a left / right slider button and you can click on thumbnails to see the large version of a specific picture.

Properties for TWebImageSlider

Property Description
ImageURLs: TStringList String list holding the URLs for all images in the TWebImageSlider

Public properties for TWebImageSlider

Property Description
ActiveImageIndex Index of the selected (active) image in the TWebImageSlider
PreviousActiveImageIndex Index of the previously selected image
LastClickedImageIndex Index of the image clicked

Methods for TWebImageSlider

Method Description
RefreshImages Call when one or more images in the ImageURLs string list was changed

Events for TWebImageSlider

Event Description
OnImageChange Event triggered when the selected (active) image is changed

Example code

This code snippet shows how to load new images in the TWebImageSlider and display tese:

  i: Integer;
  for i := 1 to 8 do
    ImageSlider.ImageURLs.add(Format('./images/nature-%d.jpg', [i]));