Click here to Skip to main content
15,921,371 members
Please Sign up or sign in to vote.
5.00/5 (1 vote)
See more:
I have created a small sample with a modified ASP menu control. I have added some JavaScript that will change the background image of my menu when mouseOver on menu. If we view in Internet Explorer, it is displaying very good. If we view the page in Google Chrome browser, it is not showing any image on mouseOver. It is even displayed in a distorted manner. The working example can be seen here.

http://aspspider.info/iamIndynos/[^]

If anyone has had this issue before, please help me to solve this problem. Is there any problem with Google Chrome??

Thanks in advance.
Posted
Updated 8-Mar-10 0:07am
v2

just adding some more codes..
My JavaScript is here:

C#
.myStyle
{
     background-image: url('Buttons/buttonBackground.png');
     
}
 .myStyle1
{
     background-image: url('Buttons/menuBack.png');
}


And my menu is here ......

XML
<asp:Menu ID="Menu2" runat="server">
                                    <StaticSelectedStyle CssClass="myStyle1" />
                            <StaticMenuItemStyle CssClass="myStyle" ForeColor="Yellow" HorizontalPadding="5px" VerticalPadding="2px" 
                                BackColor="#F3F3EE" />
                            <DynamicHoverStyle CssClass="myStyle" BackColor="#CC00CC" ForeColor="White" />
                            <DynamicSelectedStyle BackColor="#CC00CC" />
                            <DynamicMenuItemStyle CssClass="myStyle1"  HorizontalPadding="5px" VerticalPadding="2px" 
                                BackColor="#F3F3EE" />
                            <StaticHoverStyle CssClass="myStyle1" ForeColor="White" />
                                        <Items>
<asp:MenuItem Text="Choose One to Check " Value="Choose One to Kill"></asp:MenuItem>
                                            <asp:MenuItem Text="link For Asem __" Value="New Item"></asp:MenuItem>
                                            <asp:MenuItem Text="link For  Peter __" Value="New Item"></asp:MenuItem>
                                            <asp:MenuItem Text="link For  SanKar __" Value="New Item"></asp:MenuItem>
                                            <asp:MenuItem Text="link For  Baby __" Value="New Item"></asp:MenuItem>
                                            <asp:MenuItem Text="link For  All __" Value="New Item"></asp:MenuItem>
                                        </Items>
                                    </asp:Menu>
 
Share this answer
 
v2
protected void Page_PreInit(object sender, EventArgs e)
{
    // This is necessary because Safari and Chrome browsers don't display the Menu control correctly.
    // All webpages displaying an ASP.NET menu control must inherit this class.
    if (Request.ServerVariables["http_user_agent"].IndexOf("Safari",StringComparison.CurrentCultureIgnoreCase) != -1)
               Page.ClientTarget = "uplevel";
}


Hope this may help u... :)
 
Share this answer
 
After adding this one it's work for all browsers
if (Request.UserAgent.IndexOf("AppleWebKit") > 0)
{
Request.Browser.Adapters.Clear();
}

for IE8...
Add css Proferty in StyleSheet
.IE8Fix
{
    z-index: 1000;
}

and add the css property as follows...
<asp:Menu runat="server" >
  <DynamicMenuStyle CssClass="IE8Fix" />
</asp:Menu>
 
Share this answer
 
Add this code into the masterpage:

C#
protected override void AddedControl(Control control, int index)
{
    if (Request.ServerVariables["http_user_agent"].IndexOf("Safari", StringComparison.CurrentCultureIgnoreCase) != -1)
    {
        this.Page.ClientTarget = "uplevel";
    }
    base.AddedControl(control, index);
}
 
Share this answer
 
v2
Comments
TamiruD 4-Sep-13 8:36am    
this code was amazing! thanks for the TIP!!!
hi, no need to write long and long script for that,
just try this in page_load event in which menu is resides.

C#
if (Request.UserAgent.IndexOf("AppleWebKit") > 0)
        {
            Request.Browser.Adapters.Clear();
        }


thank,
mahesh patel
 
Share this answer
 
Comments
AshishChaudha 3-Oct-12 4:37am    
This will surely work.
Thanks Solution 2 Worked perfectly.....
 
Share this answer
 
Comments
Achha Insan 3-Oct-12 5:34am    
nothing is impossible. you can do it.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900