Panel Bar Animation Does not Work

2 posts, 0 answers
  1. Brad
    Brad avatar
    6 posts
    Member since:
    Sep 2011

    Posted 17 Jun Link to this post

    I am unable to get the animation for the panel bar to work in my application.  I literally copied the Demo and still the animation does not work.  I do not understand what is missing.  Clicking on the arrows neither collapses or expands.  It is as if the "click" never happens.

    <%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="ActivityDetails.aspx.cs" Inherits="ActivityWebApp.ActivityDetails" %>

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="PageScripts_Header" runat="server">
        <style>
    .aspNetDisabled {
        color: #b6bac1 !important;
        text-decoration: none;
    }
    .inline-rb input[type="radio"] {
                width: auto;
                margin: 10px;
    }
    .selected {
            font-weight: bold;
    }
    ol {
      list-style:none;
      counter-reset:mycounter;
      padding:0;
    }
    ol li {
      position:relative; 
      margin-left: 30px;
      padding-bottom: 2px;
      line-height:15px;
    }
    ol li:before {
      content:counter(mycounter); 
      counter-increment:mycounter;
      position:absolute;
      top:0;
      left:-30px;
      width:15px;
      height:15px;
      line-height:15px;
      border-radius:50%;
      color:#fff;
      background:teal;
      text-align:center;
    }

    </style>
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="HeadPlaceholder" runat="server">
    </asp:Content>
    <asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
        <div style="padding:40px">&nbsp;</div>

        <hr /> 
      <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
        <div class="demo-container size-thin">
            <telerik:RadPanelBar RenderMode="Lightweight" runat="server" ID="RadPanelBar1" Width="100%" ExpandMode="MultipleExpandedItems">
                <Items>
                    <telerik:RadPanelItem Expanded="True" Text="ASP.NET controls">
                        <Items>
                            <telerik:RadPanelItem Text="RadMenu" />
                            <telerik:RadPanelItem Text="RadTabStrip" />
                            <telerik:RadPanelItem Text="RadPanelBar" />
                            <telerik:RadPanelItem Text="RadpanelBar" />
                        </Items>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="WinForms controls">
                        <Items>
                            <telerik:RadPanelItem Text="RadMenustrip" />
                            <telerik:RadPanelItem Text="RadTabStrip" />
                            <telerik:RadPanelItem Text="RadToolStrip" />
                        </Items>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="Other projects">
                        <Items>
                            <telerik:RadPanelItem Text="SiteFinity" />
                            <telerik:RadPanelItem Text="Reporting" />
                            <telerik:RadPanelItem Text="RadAjax" />
                        </Items>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelBar>
        </div>

    </asp:Content>
    <asp:Content ID="Content4" ContentPlaceHolderID="PageScripts_Footer" runat="server">
        <script>
            
        </script>
    </asp:Content>

  2. Peter Milchev
    Admin
    Peter Milchev avatar
    847 posts

    Posted 22 Jun Link to this post

    Hello Brad,

    Attached you can find the shared snippet placed into a runnable project that animates correctly.

    If the issue is replicated only in IE, please ensure the Compatibility mode is disabled:

    Also, ensure that there are no JavaScript errors in the browser's console and no failing requests in the Network tab of the browser's DevTools(F12).

    If the issue persists, modify the attached project to replicate it and attach it to an official support ticket. That would allow us to investigate locally your exact scenario and provide more accurate and specific suggestions.

    Regards,
    Peter Milchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top