This demo illustrates how to associate the ImageZoom extension with the ImageZoomNavigator extension. ImageZoomNavigator is a data extension that displays a set of thumbnails. Clicking a thumbnail opens a corresponding image within an associated ImageZoom extension. The ImageZoomNavigator extension retrieves its images from a bound folder. The extension scales retrieved images and generates thumbnails automatically. The automatically generated images are stored in a cache folder. The path to the cache folder is defined using the SettingsAutoGeneratedImages.ImageCacheFolder property.
All options available in this demo are described below:
- ActiveItemChangeAction - specifies whether an end-user should hover a particular item or click it to activate the corresponding image within the ImageZoom extension;
- NavigationButtonVisibility - specifies whether navigation buttons should always be visible or only when the width of all items exceeds the width of the ImageZoomNavigator extension.
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
The source code files for this demo are installed (by default) in the following directory:
Open CS Solution
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxImageAndDataNavigationDemos