Hi. At the moment I am using a repeater control to create a row of imagebuttons. The item template for the repeater control actually has 3 things in it: (1) an imagebutton, (2) just a <br /> and (3) a label to put a title under each image.
The imagebuttons each link to another page (depending on the image). However, some/all of the images has suboptions and each suboption is related to a different specific page. So image1 has a page "page1", image2 has page page2.... but page1 has sub pages sub1, sub2, sub3 so this is ideal for a menu structure. Thus, I would like to make the images into the high level row of a menu - ie hovering over an image will cause the related menu to drop down.
The rad menu allows a small icon to be used in menu items but the formating doesn't really seem to support the menu items essentially being an image. One option I have is to leave the image buttons in a repeater control but to move the labels into a separate menu and to try to set the width of the menu items to match the corresponding image button. However, this seems an imperfect solution. I've also considered creating a context menu for each image but this doesn't seem an ideal solution either.
I really want the high level menu to be image based with a name label. On the telerik site (the page that I am using to create this post) there is a menu bar at the top of the page that says "DevTools for .NET" on the left with Products, online demos, free trials... However, below some items, such as Products, there is a small down arrow that, if clicked, opens a panel (although at the moment there is a bug on my PC because it is transparent not white background so is mixed with the underlying text from the page). Aside from the bug that sort of solution would also work for me and I'm not sure if its using a tooltip panel but I'm ideally looking for an easy way to populate the solution I implement.
Any suggestions?
The imagebuttons each link to another page (depending on the image). However, some/all of the images has suboptions and each suboption is related to a different specific page. So image1 has a page "page1", image2 has page page2.... but page1 has sub pages sub1, sub2, sub3 so this is ideal for a menu structure. Thus, I would like to make the images into the high level row of a menu - ie hovering over an image will cause the related menu to drop down.
The rad menu allows a small icon to be used in menu items but the formating doesn't really seem to support the menu items essentially being an image. One option I have is to leave the image buttons in a repeater control but to move the labels into a separate menu and to try to set the width of the menu items to match the corresponding image button. However, this seems an imperfect solution. I've also considered creating a context menu for each image but this doesn't seem an ideal solution either.
I really want the high level menu to be image based with a name label. On the telerik site (the page that I am using to create this post) there is a menu bar at the top of the page that says "DevTools for .NET" on the left with Products, online demos, free trials... However, below some items, such as Products, there is a small down arrow that, if clicked, opens a panel (although at the moment there is a bug on my PC because it is transparent not white background so is mixed with the underlying text from the page). Aside from the bug that sort of solution would also work for me and I'm not sure if its using a tooltip panel but I'm ideally looking for an easy way to populate the solution I implement.
Any suggestions?
3 Answers, 1 is accepted
0
Accepted
Hi Paul,
Probably, the Images only demo will help you get started with this requirement.
Let me know if you have further questions.
Kind regards,
Peter
the Telerik team
Probably, the Images only demo will help you get started with this requirement.
Let me know if you have further questions.
Kind regards,
Peter
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Paul
Top achievements
Rank 1
Rank 1
answered on 15 May 2012, 01:12 PM
Thanks the reply. I looked at the demos a week or so ago and tried a variety of options. I've just tried using imageUrl property again and yes I can make it work. However, the problem that I had when I tried it a week ago was that the images have to be correctly sized whereas using controls such as image buttons the width property can be used to force the scaling of images. If you end up with an incorrectly sized images (or if your images are sized for other aspects of the site) the menu ends up a complete mess if you just set the menuItem imageUrl property to the image. Is there any way of controlling the size and/or positioning of images in menuItems? If there isn't I need to create a specifically sized copy of the images for the menu. Thanks
0
Hi Paul,
Indeed, RadMenu does not support automatic resizing of the images, so you have to edit them in advance.
Kind regards,
Peter
the Telerik team
Indeed, RadMenu does not support automatic resizing of the images, so you have to edit them in advance.
Kind regards,
Peter
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.