This is a migrated thread and some comments may be shown as answers.

Rotator forces a gradiant due to filter

1 Answer 47 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
Esk
Top achievements
Rank 2
Esk asked on 13 May 2009, 08:46 PM
I have a division that holds my rotator. That division has a background image that is 1px semi transparent png file that repeats. When the page is initially loaded everything looks fine, however when a scroll is performed by clicking on a button the background develops a gradient on x and y.

After some investigating and inspecting i saw that rrItemList has a filter css, i tried setting explicitly that class to filter: none and that made it worse - causes the gradient to be there even on initial load. Here is my front end:
Css
#pnlPhotoStrip  
 
{  
 
margin-top: -62px;  
 
background-imageurl(images/bgrndTransparentDark.png);  
 
background-repeat:repeat;  
 
background-color:Transparent;  
 
position:relative;  
 
width:608px;  
 
height:62px;  
 
z-index:1000;  
 
filter: none!important;  
 
}  
.outerSpan  
        {  
            margin5px 4px 5px 4px;  
            bordersolid 1px #8a846c;  
        }  
        .outerSpan img  
        {  
            displayblock;  
        } 

<div id="pnlPhotoStrip">  
        <table border="0" cellpadding="0" style="width:608px;" cellspacing="0" class="tableWrapper">  
            <tr> 
                <td> 
                    <asp:Image ID="imgLeftArrow" AlternateText="left" runat="server" ImageUrl="images/btnLeft.png" /> 
                </td> 
                <td> 
                    <telerik:RadRotator ID="thumbRotator" Skin="Black" runat="server" RotatorType="Buttons" 
                        Width="550px" Height="62px" ItemHeight="62px" FrameDuration="1" OnItemClick="ShowImage" 
                        ScrollDuration="1">  
                        <ItemTemplate> 
                            <div class="outerSpan">  
                                <asp:Image ID="imgItem" ImageUrl='<%# DataBinder.Eval(Container.DataItem, "imagefile") %>' 
                                    CssClass="RotatorImage" AlternateText='<%# DataBinder.Eval(Container.DataItem, "Caption")%>' 
                                    runat="server" /> 
                            </div> 
                        </ItemTemplate> 
                        <ControlButtons LeftButtonID="imgLeftArrow" RightButtonID="imgRightArrow" /> 
                    </telerik:RadRotator> 
                </td> 
                <td> 
                    <asp:Image ID="imgRightArrow" AlternateText="right"  runat="server" ImageUrl="images/btnRight.png" /> 
                </td> 
            </tr> 
        </table> 
    </div> 

I need that background to be the same opacity in the entire div.I tried:
 - changing the skin even disabling the embedded skins - no luck. 
 - creating another div to have the background image and overlaying the pnlPhotoStrip on top of it with margin:0; and higher z-index - no luck,
 - looking at the skins css to find where that filter is being set- couldn't find the class.
- filter: none for .rrItemsList didn't help at all  even with !important and I verified that it is using the infile stylesheet call to that css block by adding a border to it and that showed.

The gradient is the entire 608px x 62px which is the width / height of pnlPhotoStrip even though the rotator is smaller.

Any suggestions how i can fix this?

PS using asp.net with ajax version 2009 q1

1 Answer, 1 is accepted

Sort by
0
Fiko
Telerik team
answered on 18 May 2009, 07:27 AM
Hello Esk,

We are not quite sure what your requirement is and that is why, I would like to ask you to open a new support ticket and send us a simple project including the CSS declarations that you used. We also need more details about the behavior that you need to achieve. It will be best if you provide us with some visual explanation as well.

All the best,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Rotator
Asked by
Esk
Top achievements
Rank 2
Answers by
Fiko
Telerik team
Share this question
or