RadRotator resizing issue

[Effat]

I have a RadRotator with RotatorType = "CoverFlow". It's width is set to 100%. I used the following code to resize it but it gives me the error: "Microsoft JScript runtime error: Object doesn't support this property or method" on rotatorElement.RadResize();  


var RadRotator1=<%= Rttr.ClientID %>;   

  window.onresize=function() 

  {   

     var rotatorElement = document.getElementById("<%= Rttr.ClientID %>");     

      rotatorElement.RadResize();   

   }

This is my ASPX code:

<table cellspacing="0" cellpadding="0" width="100%" style="table-layout: fixed">
        <tr>
            <td align="left">
                <telerik:RadRotator ID="Rttr" runat="server" Width="100%" ItemWidth="225" ScrollDirection="Left"
                    Height="285px" ItemHeight="165" ScrollDuration="500" FrameDuration="2000" RotatorType="FromCode"
                    InitialItemIndex="4" OnClientItemShown="OnClientItemShown" OnClientItemClicked="OnClientItemClicked"
                    CssClass="RemoveRotatorBorder">
                    <ItemTemplate>
                        <asp:Image ID="img1" runat="server" />
                    </ItemTemplate>
                </telerik:RadRotator>
                <telerik:RadCodeBlock ID="block1" runat="server">
                    <script type="text/javascript">
                        Telerik.Web.UI.RadRotatorAnimation.set_scrollAnimationOptions("<%= Rttr.ClientID %>",
                                            {
                                                reflectionHeight: 0.5, // The height of the reflection
                                                reflectionOpacity: 0.25
                                            }
                                        );
                    </script>
                </telerik:RadCodeBlock>
            </td>
        </tr>
    </table>

Can you please let me know what am I doing wrong and what can be done to fix the resizing issue??

[Niko]

Hi Effat,

There is no official method in the client-side API to set the size of the RadRotator. Still you could change the size of the container element of the rotator. I see in your code that this is exactly what you are trying to accomplish. Still a regular DOM element doesn't have a RadResize method. What you need to do is change the style.width or style.height of the element. Please, make sure to set the values in pixels or any other metric system supported by CSS. Also there is a shortcut to document.getElementById - $get. Here is an example how to set things up:

window.onresize=function()
  {
     var rotatorElement = $get("<%= Rttr.ClientID %>");
      rotatorElement.style.width = "225px";
      rotatorElement.style.height= "285px";
   }

Hope this helps.

All the best,
Niko
the Telerik team

[Effat]

Thanks alot :)