Rotator - Slide Show

  • Marketing Strategy

    • Product Mix
    • Pricing
    • Promotion
  • Product Mix

    • Product Line Extension
    • Branding Initiatives
    • Core Product Strengths
  • Pricing

    • Market Segmentation by Price
    • Defensive Pricing Strategy
    • Contingency Plan
  • Promotion

    • Brand Revitalization
    • Integrated Communication Mix
    • New Media initiatives
    
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This example shows how to create a MS PowerPoint like presentation system that works on any computer with a browser.

It uses custom control buttons instead of the default RadRotator buttons to change between the slides. Note that there is no need to write custom JavaScript code in order to enable the custom buttons.

You can also easily set up a different transition effect or enable automatic slide transitions by changing the RotatorType and SlideShowAnimation properties.

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

<!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" runat="server" Skin="Silk" DataSourceID="xmlDataSource1"
                            FrameDuration="4000" RotatorType="SlideShowButtons" SlideShowAnimation-Type="Fade"
                            Width="400" ItemWidth="400" Height="200" ItemHeight="200" CssClass="rotator"
                            ScrollDirection="Left,Right">
            <ItemTemplate>
                <div class="itemTemplate">
                    <div class="title">
                    <%# XPath("Title")%>
                    </div>
                    <div class="presentation">
                    <%# XPath("NewsData") %>
                    </div>
                </div>
            </ItemTemplate>
            <ControlButtons LeftButtonID="prevButton" RightButtonID="nextButton"></ControlButtons>
        </telerik:RadRotator>
        <div class="navigation">
            <asp:Image ImageUrl="images/previousSlide.gif" ID="prevButton" AlternateText="Previous Slide"
                       runat="Server" Height="34" Width="33" Style="border: 0px"></asp:Image>
            <asp:Image ImageUrl="images/nextSlide.gif" ID="nextButton" AlternateText="Next Slide"
                       runat="Server" Height="34" Width="31" Style="border: 0px"></asp:Image>
        </div>
    </div>
    <asp:XmlDataSource ID="xmlDataSource1" runat="Server" DataFile="presentation.xml">
    </asp:XmlDataSource>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?