Ticker - Rotator with Ticker

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadRotator and RadTicker are a powerful combination. Our rotator is optimized to work with any number of tickers on a frame, while RadTicker can read its parent control's databinding expressions which makes using them together a breeze.

  • DefaultCS.aspx
  • styles.css
  • jewelry.xml
<%@ Page Language="C#" AutoEventWireup="true"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="Styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container no-bg">
        <telerik:RadRotator RenderMode="Lightweight" ID="RadRotator1" DataSourceID="XmlDataSource1" runat="server"
                            Width="400" ItemWidth="400" Height="250" ItemHeight="250" FrameDuration="6000">
            <ItemTemplate>
                <div class="jewelryImage">
                    <img src="<%# XPath("Image") %>" height="250" width="150" alt="Image" />
                </div>
                <div class="jewelryRightPane">
                    <div class="jewelryDescription">
                        <div class="jewelryDescription_Text">
                            <telerik:RadTicker runat="server">
                                <Items>
                                    <telerik:RadTickerItem Text='<%# XPath("Title")%>'></telerik:RadTickerItem>
                                </Items>
                            </telerik:RadTicker>
                        </div>
                    </div>
                    <div class="jewelryName">
                        <img src="<%# XPath("ItemName") %>" height="35" width="250" alt="" />
                    </div>
                    <div class="addToCart">
                        <a href="#" onclick="return false;">
                            <img src="images/addToCart.gif" height="22" width="250" style="border: 0px" alt="add to shopping cart"
                                 title="add to shopping cart" />
                        </a>
                    </div>
                </div>
            </ItemTemplate>
        </telerik:RadRotator>
    </div>
    <asp:XmlDataSource ID="xmlDataSource1" runat="server" DataFile="jewelry.xml"></asp:XmlDataSource>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?