radimage gallery display only thumbnails

7 posts, 0 answers
  1. MBEN
    MBEN avatar
    159 posts
    Member since:
    Nov 2011

    Posted 01 Jul 2014 Link to this post

    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?
  2. MBEN
    MBEN avatar
    159 posts
    Member since:
    Nov 2011

    Posted 03 Jul 2014 in reply to MBEN Link to this post

    Hi telerik Team,

    Any help on this one?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1488 posts

    Posted 04 Jul 2014 Link to this post

    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
     

    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.

     
  5. MBEN
    MBEN avatar
    159 posts
    Member since:
    Nov 2011

    Posted 07 Jul 2014 in reply to Viktor Tachev Link to this post

    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.
  6. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 08 Jul 2014 in reply to MBEN Link to this post

    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.
  7. MBEN
    MBEN avatar
    159 posts
    Member since:
    Nov 2011

    Posted 09 Jul 2014 in reply to Princy Link to this post

    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?
  8. MBEN
    MBEN avatar
    159 posts
    Member since:
    Nov 2011

    Posted 09 Jul 2014 in reply to MBEN Link to this post

    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017