I would like to use this control for a front page iamge gallery that would take the whole width of the screen. In other words, I would like to know how to stretch the image that may be smaller to truly take the full screen like here:
The very important thing here is that the image gallery itself and the image area both have height of 100%. The other setting disable some functionalists that are not needed since the toolbar is hidden.
3. Hide the toolbar:
CSS:
.rigToolbar {
display: none;
}
4. Set the position property of the gallery so that it stays fixed at the top:
CSS:
.CustomImageGallery {
position:fixed;
top: 0;
left: 0;
}
5. Then you can place the dots wherever you like by using this rule:
CSS:
.rigDotList {
bottom: 500px;
left: 100px;
}
6. To turn on the slide show, you can do the following on page load:
Please find attached a sample page that illustrates the approach.
I hope this helps.
Regards,
Venelin
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.