Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
25
Item Images Resize
posted

I'm trying to use images in the WebDataMenu that are larger (64x64) than I see in the samples (around 32x32).  Does anyone know how to scale the images in the WebMenuBar using CSS or some other property?  My item list is bound to an XMLDataSource, and I don't see any databinding options that let me set the image size.

Thoughts?

  • 24671
    Suggested Answer
    posted

    Hi,

    There are several ways to achieve this:

    1) In the WebDataMenu control, there are two CSS classes : igdm_MenuItemVerticalIcon, and igdm_MenuItemHorizontalIcon, that you can modify to set specific height and width for the images that are rendered. You can, for example, modify these classes in the current StyleSet you use , in ig_datamenu.css

    Example:

     

    .igdm_MenuItemVerticalIcon

    {

    clear: none;

    padding-right: 6px;

    text-align: left;

    vertical-align: middle;

    border: 0px none;

        width:16px;

    height:16px;

    }

     

    2) You can process all of your images with some thumbnail program that resizes all the images to a specific size, so that when they are rendered, they are guaranteed to be of the desired size. In this way you do not need to use CSS in order to alter the size. I would recommend using this approach, if you have control over your datasource that contains the images. This is because if you resize the images with CSS, it will work fine but the size of the image in terms of bytes would be the same (i.e. bigger than it has to be) as the unresized image.

    Hope it helps,

    Angel