RadAjaxLoadingPanel Transparency IE8 not working

5 posts, 0 answers
  1. waircit
    waircit avatar
    17 posts
    Member since:
    Jan 2005

    Posted 16 Jun 2010 Link to this post

    Hi there,

    it's working fine on IE7, Firefox, Chrome.

    On IE8 it just has full background color. Is there any workaround for this?

    I have tried both setting transparency for the radajaxloadingpanel declaratively + through CSS opacity property.

    Thanks!
  2. Dimo
    Admin
    Dimo avatar
    8472 posts

    Posted 17 Jun 2010 Link to this post

    Hello waircit,

    Please try our online demos:

    http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/loadingimages/defaultcs.aspx

    If the problem exists there as well, then check your browser security settings - probably they are too restrictive with regard to scripting, ActiveX, etc.

    Best wishes,
    Dimo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Chen
    Chen avatar
    46 posts
    Member since:
    Oct 2010

    Posted 28 Aug 2011 Link to this post

    The demo does not answer the question (which I have as well).

    In the demo, the declaration does not include transparency, e.g. 
    <telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="server" Transparency="10"
       
    </telerik:RadAjaxLoadingPanel>

    In IE8, the circle that shows progress, does not show. In all other browsers it does.
    Any solution (other than ignoring the Transparency capability?)
  4. Galin
    Admin
    Galin avatar
    526 posts

    Posted 31 Aug 2011 Link to this post

    Hello Chen,

    Internet Explorer does not support animated images placed inside an element with a filter style applied (the transparency in IE uses such a style).

    You can workaround this by creating a custom skin for RadAjaxLoadingPanel and use the desired loading image there.

    http://www.telerik.com/community/code-library/aspnet-ajax/ajax/how-to-create-and-use-custom-skins-for-radajaxloadingpanel.aspx

    Also you can simply override the styles of an existing skin, you need only these three CSS rules:
    .RadAjax_[Skin_Name] .raDiv /*use this rule if you need to change the loading image */
    {
        background-image:url('Ajax/loading.gif');
    }
      
    .RadAjax_[Skin_Name] .raColor /*use this rule if you need to change the bg color*/
    {
        background-color:#d8dee3;
    }
      
    .RadAjax_[Skin_Name] .raTransp /*finally use this rule for changing transparency level*/
    {
        opacity:0.2;
        -moz-opacity:0.2; /*For old Mozilla Browsers*/
        filter:alpha(opacity=20); /*For IE*/
    }

    I hope this helps.

    Regards,
    Galin
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  5. Phil
    Phil avatar
    16 posts
    Member since:
    Jan 2011

    Posted 06 Apr 2012 Link to this post

    Setting transparency=0 solved IE8 image display problems, thank you! (2012 Q1)
    Phil
Back to Top