All Telerik .NET tools and Kendo UI JavaScript components in one package. Now enhanced with:
New to Telerik UI for ASP.NET AJAX? Download free 30-day trial
<%@ Page Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.FloatingActionButton.Appearance.DefaultCS" CodeFile="DefaultCS.aspx.cs" %> <%@ 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> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" /> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="ConfiguratorPanel1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="ConfiguratorPanel1" /> <telerik:AjaxUpdatedControl ControlID="RadFloatingActionButton1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <telerik:RadWindowManager runat="server"></telerik:RadWindowManager> <div class="demo-container" style="height: 300px; position: relative;"> <telerik:RadWindowManager runat="server"></telerik:RadWindowManager> <telerik:RadFloatingActionButton runat="server" ID="RadFloatingActionButton1" Icon="home" Text="Home" PositionMode="Absolute" Align="MiddleStart"> <AlignOffsetSettings X="150" /> </telerik:RadFloatingActionButton> </div> <qsf:ConfiguratorPanel ID="ConfiguratorPanel1" runat="server"> <Views> <qsf:View> <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Title="Shape" Size="Narrow"> <ul class="fb-group"> <li> <qsf:ComboBox ID="ShapeOptions" runat="server" AutoPostBack="true" Size="Wide" OnSelectedIndexChanged="ShapeOptions_SelectedIndexChanged"> <Items> <telerik:RadComboBoxItem Text="Rectangle" Value="Rectangle" /> <telerik:RadComboBoxItem Text="Square" Value="Square" /> <telerik:RadComboBoxItem Text="Pill" Value="Pill" Selected="true" /> </Items> </qsf:ComboBox> </li> </ul> </qsf:ConfiguratorColumn> <qsf:ConfiguratorColumn ID="ConfiguratorColumn2" runat="server" Title="Size" Size="Narrow"> <ul class="fb-group"> <li> <qsf:ComboBox ID="SizeOptions" runat="server" AutoPostBack="true" Size="Wide" OnSelectedIndexChanged="SizeOptions_SelectedIndexChanged"> <Items> <telerik:RadComboBoxItem Text="Small" Value="Small" /> <telerik:RadComboBoxItem Text="Medium" Value="Medium" Selected="true" /> <telerik:RadComboBoxItem Text="Large" Value="Large" /> <telerik:RadComboBoxItem Text="None" Value="None" /> </Items> </qsf:ComboBox> </li> </ul> </qsf:ConfiguratorColumn> <qsf:ConfiguratorColumn ID="ConfiguratorColumn3" runat="server" Title="Theme Color" Size="Narrow"> <ul class="fb-group"> <li> <qsf:ComboBox ID="ThemeColorOptions" runat="server" AutoPostBack="true" Size="Wide" OnSelectedIndexChanged="ThemeColorOptions_SelectedIndexChanged"> <Items> <telerik:RadComboBoxItem Text="Primary" Value="Primary" /> <telerik:RadComboBoxItem Text="Secondary" Value="Secondary" Selected="true" /> <telerik:RadComboBoxItem Text="Tertiary" Value="Tertiary" /> <telerik:RadComboBoxItem Text="Info" Value="Info" /> <telerik:RadComboBoxItem Text="Success" Value="Success" /> <telerik:RadComboBoxItem Text="Warning" Value="Warning" /> <telerik:RadComboBoxItem Text="Error" Value="Error" /> </Items> </qsf:ComboBox> </li> </ul> </qsf:ConfiguratorColumn> </qsf:View> </Views> </qsf:ConfiguratorPanel> </form> </body> </html>