Hello
Im trying to make the whole image react when the mouse hover on the root menu item, but it actually just take the first 24 pixels of the image or so
here is a sample
Im trying to make the whole image react when the mouse hover on the root menu item, but it actually just take the first 24 pixels of the image or so
here is a sample
<%@ Page Language="VB" AutoEventWireup="false" CodeBehind="TelerikWebForm.aspx.vb" Inherits="WebApplication2.TelerikWebForm" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" /></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <%--Needed for JavaScript IntelliSense in VS2010--%> <%--For VS2008 replace RadScriptManager with ScriptManager--%> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <script type="text/javascript"> //Put your JavaScript code here. </script> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> </telerik:RadAjaxManager> <div> <telerik:RadMenu runat="server"> <Items> <telerik:RadMenuItem Text="" ImageUrl="GDGlobal-95x25.png" Width="95px"> </telerik:RadMenuItem> </Items> </telerik:RadMenu> </div> </form></body></html>
Any idea what I'm doing wrong?
Thanks7 Answers, 1 is accepted
0
Hello Louis,
The code that you have provided seems correct and I can not see any reason why the image takes only 24px and not the size of the image. I also attached the page that I used to test your issue. Please take a look at it and let me know if this helps.
All the best,
Kate
the Telerik team
The code that you have provided seems correct and I can not see any reason why the image takes only 24px and not the size of the image. I also attached the page that I used to test your issue. Please take a look at it and let me know if this helps.
All the best,
Kate
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Louis
Top achievements
Rank 1
Rank 1
answered on 28 Jul 2011, 06:37 PM
Hello
thanks for your response, your example works exactly like mine, look at the attach image, this is when the mouse is hover the first menu item icon, why isn't the entire icon image on a full orange background, not just the first 24 pixel of it, when can see that it creates an underline with the proper length, but not the background...
Thanks
thanks for your response, your example works exactly like mine, look at the attach image, this is when the mouse is hover the first menu item icon, why isn't the entire icon image on a full orange background, not just the first 24 pixel of it, when can see that it creates an underline with the proper length, but not the background...
Thanks
0
Hello Louis,
Thanks for the image, it gave us a clear idea of the appearance that you described. This is a bug of the Outlook skin of the RadMenu. Thank you for reporting it. I also updated your Telerik points.
Kind regards,
Kate
the Telerik team
Thanks for the image, it gave us a clear idea of the appearance that you described. This is a bug of the Outlook skin of the RadMenu. Thank you for reporting it. I also updated your Telerik points.
Kind regards,
Kate
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Nekud
Top achievements
Rank 2
Rank 2
answered on 05 Nov 2013, 04:44 PM
Has this issue been solved yet? If so, where can I find the solution?
Thanks,
Nekud
Thanks,
Nekud
0
Hello Nuked,
The issue that is described here is expected to occur when a larger image is applied to the items and no text is set. It is not a bug of the control but it is rather caused due to the current rendering. To have it working as expected you can use the following css class selector:
Regards,
Kate
Telerik
The issue that is described here is expected to occur when a larger image is applied to the items and no text is set. It is not a bug of the control but it is rather caused due to the current rendering. To have it working as expected you can use the following css class selector:
.rmItem { width: auto !important; } .rmLink:hover img, .rmSelected img { background-image: url( rmSprite.png ); background-position: 100% -96px; } .rmExpanded img, .rmExpanded:hover img { background-image: url( rmSprite.png ); background-position: 100% -144px; } html .RadMenu a.rmImageOnly .rmLeftImage { padding-right: 12px; } html .RadMenu .rmRootGroup a.rmImageOnly { height: 23px; padding-left: 12px; }Regards,
Kate
Telerik
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 the blog feed now.
0
Nekud
Top achievements
Rank 2
Rank 2
answered on 08 Nov 2013, 03:49 PM
Hi Kate,
Thank you for the reply. I'm sorry I did not post my specific requirements with the menu and the image. Here is a brief description:
I have small images 24 x 24 on the left and Text on the right. I have used the Telerik Radmenu skin - Web20. By default, the menu text lays on the top (please see attached filename-DefaultMenuSelection) parallel to the top of the image. But I want the text to be aligned parallel to the bottom of the image (please see attached filename - MenuImageSelectionIssue). I achieve this behavior by adding the following :
Thank you for the reply. I'm sorry I did not post my specific requirements with the menu and the image. Here is a brief description:
I have small images 24 x 24 on the left and Text on the right. I have used the Telerik Radmenu skin - Web20. By default, the menu text lays on the top (please see attached filename-DefaultMenuSelection) parallel to the top of the image. But I want the text to be aligned parallel to the bottom of the image (please see attached filename - MenuImageSelectionIssue). I achieve this behavior by adding the following :
.rmText { font-size: small !important; cursor: hand !important; margin-top:7px; margin-left: 15px; }
But when I do that and hover over the menu, The selection for text and image becomes segregated which I don't want. So how can I make it consistent? Also, the cursor hand holds only true for text and not for the picture. How can I make it hand for the whole radmenuItem?
Thanks,
Nekud
0
Hello Nekud,
The issue that you experience is caused due to the fact that the 24x24pixels image set a different height to the RadMenu. For this reason I would suggest that you refer to the following help article where you can get more information on how to alter the height of the control - How to change height of RadMenu.
Regards,
Kate
Telerik
The issue that you experience is caused due to the fact that the 24x24pixels image set a different height to the RadMenu. For this reason I would suggest that you refer to the following help article where you can get more information on how to alter the height of the control - How to change height of RadMenu.
Regards,
Kate
Telerik
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 the blog feed now.