New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Banner Rotation

Banner rotation with RadRotator is easy and stylish! All you need to do is to declare the needed banner images and corresponding Urls in the datasource and get your banners up and running.

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

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="stylesheet" type="text/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 size-medium">
        <telerik:RadRotator RenderMode="Lightweight" runat="server" Skin="Silk" DataSourceID="xmlDataSource1" ID="rotator1" ScrollDirection="Up"
            FrameDuration="3000" Width="600px" ItemWidth="600px" Height="186px" ItemHeight="186px">
            <ItemTemplate>
                <div class="itemTemplate">
                    <a href="<%# XPath("href") %>">
                        <img src="images/<%# XPath("filename") %>" alt="<%# XPath("description") %>" style="border: 0px;" /></a>
                </div>
            </ItemTemplate>
        </telerik:RadRotator>
        <asp:XmlDataSource ID="xmlDataSource1" runat="server" DataFile="Banners.xml"></asp:XmlDataSource>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance