Coverflow - text under pictures

[jc mag]

Is it possible to display text under each pictures in coverflow mode?

[Shinu]

Hello,



You can customize the item by using adding controls in ItemTemplate section.

A sample mark-up is shown:

<telerik:RadRotator ID="RadRotator1" runat="server"
     Width="748px" ItemWidth="150" ScrollDirection="Left, Right" Height="233px" ItemHeight="113"
     ScrollDuration="500" FrameDuration="2000" PauseOnMouseOver="false" RotatorType="CoverFlow"
     InitialItemIndex="4" OnClientItemShown="OnClientItemShown" OnClientItemClicked="OnClientItemClicked"
     CssClass="RemoveRotatorBorder">
     <ItemTemplate>
         <asp:Image ID="Image1" runat="server" ImageUrl='<%# Container.DataItem %>' />
         <asp:Label ID="Label1" runat="server" Text='<%# Eval("CategoryName") %>'></asp:Label>
     </ItemTemplate>
 </telerik:RadRotator>

More information: CoverFlow Mode


-Shinu.

[Tsvetie]

Hello Shinu,
You can review our car rental demo application as well - http://demos.telerik.com/aspnet-ajax/carrental. In this application, we are using a Label control in the ItemTemplate of RadRotator. Even though in the application we are using a rotator in Carousel mode, you can use the same idea for the ItemTemplate with a rotator in CoverFlow mode.

Greetings,
Tsvetie
the Telerik team

[jc mag]

Thanks, it works; but the texts are overlapping each other. Is there a way to show the text only for the current item?
I was thinking about using OnClientItemShown, so I could display the texts outside the rotator for full customization, but I can't find in the help how to retrieve the dataitem of the current item...

[Fiko]

Hello jc,

You can use the approach show in this code library in order ti get reference to the elements in the rotator's ItemTemplate.

Kind regards,
Fiko
the Telerik team

[jc mag]

Thanks, I've been able to do what I wanted to, except that it doesn't work in IE6 :(
Your getWrapperElement:

function getWrapperElement(rotatorItem)
{
    var itemElem = rotatorItem.get_element();
    var wrapper = itemElem.firstChild;
    return wrapper;
}

returns null in IE6... ??
EDIT: it works now, probably my mistake