All docs
V24.2
24.2
24.1
23.2
23.1
22.2
22.1
21.2
21.1
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2.
19.1
The page you are viewing does not exist in version 19.1.
18.2
The page you are viewing does not exist in version 18.2.
18.1
The page you are viewing does not exist in version 18.1.
17.2
The page you are viewing does not exist in version 17.2.

JavaScript/jQuery Gallery - Overview

The Gallery is a UI component that displays a collection of images in a carousel. The UI component is supplied with various navigation controls that allow a user to switch between images.

View Demo

The following code adds the Gallery UI component to your page. The simplest configuration of the UI component requires only a dataSource and height to be specified.

HTML
JavaScript
  • <div id="galleryContainer"></div>
  • $(function () {
  • $("#galleryContainer").dxGallery({
  • dataSource: [
  • "https://js.devexpress.com/Content/images/doc/24_2/PhoneJS/person1.png",
  • "https://js.devexpress.com/Content/images/doc/24_2/PhoneJS/person2.png",
  • "https://js.devexpress.com/Content/images/doc/24_2/PhoneJS/person3.png",
  • "https://js.devexpress.com/Content/images/doc/24_2/PhoneJS/person4.png"
  • ],
  • height: 300
  • });
  • });
See Also