Menu Right Arrow image is not woriking in Chrome

9 posts, 0 answers
  1. nsrikanth 2009
    nsrikanth 2009 avatar
    39 posts
    Member since:
    Apr 2010

    Posted 31 Dec 2013 Link to this post

    hi

    Menu right Arrow image is not working in chrome , it is working fine IE. we are using 2010.1.519.35. we are using following CSS for Right Arrow

    .rmVertical .rmExpandRight     
    {      
        
        background: transparent url('../../images/MenuRightArrow.gif') no-repeat right right !important;                         
                
    }

    i tried url base 64 also it is not working , please suggest me the solution


  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 01 Jan 2014 Link to this post

    Hi,

    Please have a look into the sample code snippet which works fine at my end. 

    ASPX:
    <telerik:RadMenu ID="Rad1" runat="server" Flow="Vertical">
        <Items>
            <telerik:RadMenuItem Text="T1" runat="server">
                <GroupSettings ExpandDirection="Right" Flow="Vertical" />
                <Items>
                    <telerik:RadMenuItem Text="t1.1" runat="server">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="t1.2" runat="server">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="t1.3" runat="server">
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadMenu>

    CSS:
    <style type="text/css">
        .RadMenu .rmVertical .rmExpandRight
        {
            background: transparent url('plus.gif') no-repeat !important;
        }
    </style>

    Please provide your full code with CSS if it doesn't help.
    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. nsrikanth 2009
    nsrikanth 2009 avatar
    39 posts
    Member since:
    Apr 2010

    Posted 02 Jan 2014 Link to this post

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
    <head runat="server">
        <title></title>
        <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
    </head>
    <link href="Menu.css" rel="stylesheet" type="text/css" />
     
     
    <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 id="RadMenu1" runat="server" EnableShadows="true" 
                    Width="100%" EnableRoundedCorners="true" EnableSelection="false"
                    CollapseAnimation-Type="none">
                </telerik:RadMenu>
        </div>
        </form>
    </body>
    </html>
    using System;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
     
    using System.Data;
    using System.Configuration;
    using System.Web.Security;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;
    using Telerik.Web.UI;
    using System.Xml;
     
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string path = HttpContext.Current.Server.MapPath(".");
     
            XmlTextReader reader = new XmlTextReader(path + "\\s.xml");
            XmlDocument doc = new XmlDocument();
            XmlNode node;
            try
            {
                doc.Load(reader);
            }
            catch (Exception)
            {
                reader.Close();
            }
            finally
            {
                reader.Close();
            }
            RadMenu1.LoadXml(doc.InnerXml);
        }
    }
    .MainMenu
    {
        background-color: #4687CC;
        height : 22px;  
        text-align: center;
    }
     
    A.MainMenuItem:visited
    {
        padding: 2 2 2 2;
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif;
        text-decoration: none;
        color: #FFFFFF;
        font-size: 8pt;
        font-weight: normal;
    }
     
    A.MainMenuItem:link
    {
        padding: 2 2 2 2;
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif;
        text-decoration: none;
        color: #FFFFFF;
        font-size: 8pt;
    }
     
    A.MainMenuItem:hover
    {
        padding: 2 2 2 2;
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif;
        text-decoration: none;
        color: #FFFFFF;
        font-size: 8pt;
        background: #4687CC;       
        font-weight: bold;
    }       
     
    .menuDropDownMenu
    {
        LEFT: -1000px;
        OVERFLOW: hidden;
        POSITION: absolute;
        TOP: -1000px;
        COLOR: #000000;
        font-size: 10px;
    }
     
    .menuDropDownMenu .content
    {
        POSITION: absolute;
        COLOR: #000000;
        font-size: 10px;
    }
     
    .menuDropDownMenu .items
    {
        BORDER-RIGHT: steelblue 1px solid;
        BORDER-TOP: steelblue 0px solid;
        Z-INDEX: 2;
        LEFT: 0px;
        BORDER-LEFT: steelblue 1px solid;
        BORDER-BOTTOM: steelblue 0px solid;
        POSITION: relative;
        TOP: 0px;
        COLOR: #000000;
        font-size: 10px;
    }
     
     
    .menuDropDownMenu .item
    {
        background-color: #B0C4DE;
        BORDER-RIGHT: medium none;
        BORDER-TOP: medium none;
        FONT-SIZE: 8pt;
        BORDER-LEFT: medium none;
        cursor: hand;
        BORDER-BOTTOM: medium none;
        FONT-FAMILY: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif;
        TEXT-DECORATION: none;
        font-weight: normal;
        color: #000000;
        font-size: 10px;
    }
     
    .menuDropDownMenu .background
    {
        COLOR: #000000;
        Z-INDEX: 1;
        LEFT: 0px;
        POSITION: absolute;
        TOP: 0px;
        font-size: 10px;
    }
     
    .menuDropDownMenu .shadowRight
    {
        Z-INDEX: 3;
        WIDTH: 0px;
        POSITION: absolute;
        TOP: 0px;
        font-size: 10px;
    }
     
    .menuDropDownMenu .shadowBottom
    {
        Z-INDEX: 1;
        LEFT: 0px;
        POSITION: absolute;
        HEIGHT: 0px;
        font-size: 10px;
    }
     
    .menuDropDownMenu .hover
    {
        BACKGROUND: #4687CC;
        FONT-SIZE: 8pt;
        FONT-FAMILY: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif;
        font-size: 10px;
    }
     
     
    #ConfigurationPanel1 ul
    {
        list-style:none;
        margin:10px 0 0 0;
        padding:0;
        height: 30px;
    }
    #ConfigurationPanel1 ul label
    {
        display:inline-block;
        padding: 0 10px;
    }
    #ConfigurationPanel1 h3
    {
        font: 13px 'Segoe UI', Arial, 'sans-serif';
        color:#B0C4DE !important;
        clear:both;
        display:block;
        margin:0;
    }
    #ConfigurationPanel1 #ApplySettingsButton
    {
        clear:both;
        display:block;
        margin:0 0 10px auto;
    }
     
    #ConfigurationPanel1 .animation-settings
    {
        border-left:1px solid #B0C4DE !important;
        width: 324px;
        float: left;
        padding-left: 20px;
    }
     
    #ConfigurationPanel1 .general-settings
    {
        float: left;
        width: 280px;
    }
     
    #ConfigurationPanel1 .animation-settings li
    {
        float:left;
    }
     
    #ConfigurationPanel1 .general-settings li
    {
        padding-bottom: 10px;
    }
     
    .menu-container .RadMenu
    {
        float:none;
    }
    .MenuClass
    {
        background-color:#B0C4DE !important;
    }
     
    .rmRootGroup
    {
        background:#4687cc !important
    }
     
    .rmLink
    {
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif !important;
        text-decoration: none !important;
        background-color: #B0C4DE !important;
        background-image:none !important;
    }
     
    .rmLink:hover
    {
        padding: 2 2 2 2;
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif !important;
        text-decoration: none !important;
        background: #4687CC !important;    
         
        background-color: #4687CC !important;
        cursor: hand !important;
        font-weight: bold !important;
     
    }
     
    .rmHorizontal, .rmItem
    {
        border-right: 1px solid white !important;
    }
     
    .rmHorizontal, .rmLast
    {
        border-right: 0 !important;
    }
     
    .rmText 
        background-image: none !important;
         
    }
     
    .rmRootLinkMenu
    {
        background:#4687CC !important ;  
        cursor: hand !important;
        white-space:normal !important;
        text-align: center !important;
         
    }
    .rmExpanded, 
    .rmExpanded:hover
        background-image:none !important;
        background-color:#4687CC !important;
    }
     
    .rmLink:hover
    {
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif !important;
        text-decoration: none !important;
        background: #4687CC !important;    
        background-color: #4687CC !important;
        cursor: hand !important;
        font-weight: bold !important;
        color:White !important;
     
    }
    .rmText
    {
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif !important;
        font-size: 8pt !important;
    }
    .rmText:hover
    {
        font-family: Arial, Tahoma, Geneva, Arial, Helvetica, sans-serif !important;
        text-decoration: none !important;
        background: #4687CC !important;    
        background-color: #4687CC !important;
        cursor: hand !important;
        font-weight: bold !important;
         
    }
     
    .rmVertical .rmExpandRight    
    {     
         
        background: transparent url('MenuRightArrow.gif') no-repeat right right !important;                        
                  
    }
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
      
     
     
     
     
     
     
     
     
     
      
    <?xml version="1.0" encoding="utf-8" ?>
    <Menu>
      <Group>
        <Item Text="File" Key="F" >
          <Group>
            <Item  Text="New" />
            <Item  Text="Open">
              <Group Width="140" Flow="Vertical">
                <Item  Text="Project" />
                <Item  Text="Project From Web" />
                <Item  Text="File" />
                <Item  Text="File from Web" />
              </Group>
            </Item>
            <Item  Text="PostBack Item" PostBack="True"/>
            <Item  IsSeparator="True" />
            <Item  Text="ToolTip Item" ToolTip="This is a tooltip" />
            <Item  Text="Add Existing Item" />
            <Item  Text="Add Project" />
          </Group>
        </Item>
        <Item  Text="Edit" AccessKey="E" >
          <Group Flow="Vertical">
            <Item  Text="Undo" />
            <Item  Text="Redo" Enabled="False" />
            <Item  Text="Cut" />
            <Item  Text="Copy" />
            <Item  Text="Paste" />
          </Group>
        </Item>
        <Item  Text="View" AccessKey="V" >
          <Group Flow="Vertical">
            <Item  Text="Open" />
            <Item  Text="Open With" />
            <Item  Text="Toolbox">
              <Group>
                <Item  Text="Project" />
                <Item  Text="Project From Web" />
                <Item  Text="File" />
                <Item  Text="File from Web" />
              </Group>
            </Item>
            <Item  Text="Resource View" />
            <Item  Text="Properties" />
          </Group>
        </Item>
        <Item  Text="Help" Key="H" >
          <Group Flow="Vertical" OffsetX="-26">
            <Item  Text="Index" />
            <Item  Text="Search" />
            <Item  Text="Online" />
            <Item  Text="Telerik Home Page" Href="http://www.telerik.com" />
          </Group>
        </Item>
      </Group>
    </Menu>

    we are using XML binding to menu control , it is working fine IE. can please check code once

    Thanks
    Narala
  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 02 Jan 2014 Link to this post

    Hi,

    Unfortunately I couldn't replicate the issue at my end. The give code is working fine for me. One  suggestion is that you can upgrade the telerik version to show the RightArrow image on the Menu Item which have Child Items. This will automatically added in the RadMenu, no need to write the code for showing the arrow.

    Thanks,
    Shinu.
  6. nsrikanth 2009
    nsrikanth 2009 avatar
    39 posts
    Member since:
    Apr 2010

    Posted 03 Jan 2014 Link to this post

    hi Shinu
    is there any other alternative solution because our team will not accept Telerik upgrade. if any other solution please

    Thanks
    Narala
  7. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 06 Jan 2014 Link to this post

    Hi,

    I have tried your code and the RightArrow image on the Menu was showing for me in the older version itself. Unfortunately I cannot suggest an alternative with the given information. With Telerik upgrades you will get the latest features and fixes and make your development easier.

    Thanks,
    Shinu.
  8. nsrikanth 2009
    nsrikanth 2009 avatar
    39 posts
    Member since:
    Apr 2010

    Posted 07 Jan 2014 Link to this post

    Hi

    in IE it is working fine for me also , in chrome we are not getting Right Arrow image .

    can you please send me that sample project ,  i will test once

    Thanks
    Narala
  9. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 07 Jan 2014 Link to this post

    Hi,

    Please have a look into the sample project which works fine at my end.

    Thanks,
    Shinu.
  10. nsrikanth 2009
    nsrikanth 2009 avatar
    39 posts
    Member since:
    Apr 2010

    Posted 07 Jan 2014 Link to this post

    hi

    thanks , can you please send me the sample in .NET framework 3.5 . i am unable to test your sample because we are using VS2008

    Please ...

    Thanks
    Narala

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017