radimage gallery display only thumbnails

[MBEN]

I am using a RadImageGallery to show a collection of images on my page.
I want to show 3 images on the screen visible at all times. I want to disable the option of clicking a thumbnail to enlarge it. I also noticed that my images in thumbnails are rendered darker than they are and they appear light when i hover over them. Can i have them all be rendered in their original brightness as I do not want the hover feature?

[MBEN]

Hi telerik Team,

Any help on this one?

[Viktor Tachev]

Hi,

If you would like not to show the ImageArea you could add the following CSS rule to the page:

.rigItemBox {
    display: none;
}

By default only the active image in the ThumbnailsArea seems brighter and the opacity for the other images is lowered. If you would like to change that you could use the CSS below:

.RadImageGallery .rigThumbnailsList li img {
    opacity: 1;
}

Regards,
Viktor Tachev
Telerik

 

 

[MBEN]

That works.
However the thumbnail still shows the image as clickable. If the user clicks the image it hides the thumbnails and shows nothing.
I need to remove the click on the thumbnails so that they appear as static images.

[Princy]

Hi MBEN,

Please have a look into the sample code snippet which works fine at my end. Please provide your code if it doesn't help.

ASPX:

<telerik:RadImageGallery ID="RadImageGallery2" runat="server" CssClass="border-for-div"
    AllowPaging="false" NavigationMode="Zone" BackColor="White" Width="100%" LoopItems="True">
    <Items>
        <telerik:ImageGalleryItem ImageUrl="~/Images/Capture.PNG" Title="Aajeevika" />
        <telerik:ImageGalleryItem ImageUrl="~/Images/2.PNG" Title="kudumbashree" />
        <telerik:ImageGalleryItem ImageUrl="~/Images/3.PNG" Title="Mavim" />
        <telerik:ImageGalleryItem ImageUrl="~/Images/blueline.PNG" Title="SERP" />
        <telerik:ImageGalleryItem ImageUrl="~/Images/globe.jpg" Title="TISS" />
        <telerik:ImageGalleryItem ImageUrl="~/Images/images.jpg" Title="WorldBank" />
    </Items>
</telerik:RadImageGallery>

CSS:

.rigItemBox
{
    display: none;
}
.RadImageGallery .rigThumbnailsList li img
{
    opacity: 1;
}

Thanks,
Princy.

[MBEN]

I have a variable path for the images folder for different clients.
I don't see an ID with RadImageGalleryItem which would let me set the path in code behind.

Any ideas?

[MBEN]

I figured it out.
I still had the displaymode set as thumbnails which was making it work incorrect. It works fine after i removed it.