This is a migrated thread and some comments may be shown as answers.

Q1.2009: Telerik.Web.UI.AnimationFunctions is null or not an object

2 Answers 77 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

CSurieux asked on 19 Mar 2009, 12:08 PM

Hello,

Just migrated from last 2008 version to Q1.2009 and I now get this javascript error.
I am using a variant of the sliding radpanel sample and it seems to crash now in

    
            function SetUpAnimation() {  
        
                //cleanSlider();  
        
                panelDomElement.style.position = "relative";  
        
                var expandAnimation = new Telerik.Web.UI.AnimationSettings({});  
        
                var collapseAnimation = new Telerik.Web.UI.AnimationSettings({});  
        
                slide = new Telerik.Web.UI.Slide(panelDomElement, expandAnimation, collapseAnimation, false);  
        
                slide.initialize();  
        
                slide.set_direction(Telerik.Web.UI.SlideDirection.Right);  
        
                slider.onclick = function()   
        
                {  
        
                    panelDomElement.parentNode.style.visibility = "visible";  
        
                    panelDomElement.parentNode.style.display = "block";  
        
                    if (!expanded)   
        
                    {  
        
                        slide.expand();  
        
                    }  
        
                    else   
        
                    {  
        
                        slide.collapse();  
        
                    }  
        
                    expanded = !expanded;  
        
                    return false;  
        
                }  
        
            }

Thanks for urgent help.

CS

2 Answers, 1 is accepted

answered on 19 Mar 2009, 12:48 PM

Hello Christian,

Please find below a modified version of the sliding panelbar that works es expected.

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title></title>  
        
                <style type="text/css">  
        
                    .leftPanelBarContainer  
        
                    {  
        
                        float: left;  
        
                        width: 250px;  
        
                        height: 250px;  
        
                        overflow: auto;  
        
                        position: relative; /* Required to workaround IE rendering bug*/  
        
                    }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
        
                </telerik:RadScriptManager> 
        
                <asp:ImageButton runat="server" ID="tbimage" ImageUrl="Toolbox.gif" Style="float: left;  
        
                    outline: 0; width: 21px" /> 
        
                <div class="leftPanelBarContainer">  
        
                    <div id="slidingDiv" style="visibility: hidden">  
        
                        <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Height="250px" ExpandMode="FullExpandedItem">  
        
                            <Items> 
        
                                <telerik:RadPanelItem Expanded="True" Text="ASP.NET controls">  
        
                                    <Items> 
        
                                        <telerik:RadPanelItem Text="RadComboBox" ImageUrl="img/ComboboxPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadMenu" ImageUrl="img/MenuPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadTabStrip" ImageUrl="img/TabstripPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadPanelBar" ImageUrl="img/PanelBarPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadTreeView" ImageUrl="img/TreeviewPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadToolBar" ImageUrl="img/ToolbarPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadChart" ImageUrl="img/ChartPr.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelItem> 
        
                                <telerik:RadPanelItem Text="WinForms controls">  
        
                                    <Items> 
        
                                        <telerik:RadPanelItem Text="RadComboBox" ImageUrl="img/Combobox_Win.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadDock" ImageUrl="img/Dock_Win.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadGridView" ImageUrl="img/RadGrid.bmp">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="RadTabStrip" ImageUrl="img/Tabstrip_Win.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelItem> 
        
                                <telerik:RadPanelItem Text="Other projects">  
        
                                    <Items> 
        
                                        <telerik:RadPanelItem Text="SiteFinity" ImageUrl="img/st.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem Text="Reporting" ImageUrl="img/report.gif">  
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelItem> 
        
                            </Items> 
        
                        </telerik:RadPanelBar> 
        
                    </div> 
        
                </div> 
        
                <script type="text/javascript">  
        
                    var panelDomElement = $get('<%=RadPanelBar1.ClientID %>');  
        
                    if (panelDomElement) {  
        
                        SetUpAnimation("tbimage", Telerik.Web.UI.jSlideDirection.Right, panelDomElement);  
        
                    }  
        
                    function SetUpAnimation(image, direction, element) {  
        
                        element.style.position = "relative";  
        
                        var slider = document.getElementById(image);  
        
                        var expanded = false;  
        
                        var expandAnimation = new Telerik.Web.UI.AnimationSettings({});  
        
                        var collapseAnimation = new Telerik.Web.UI.AnimationSettings({});  
        
                        var slide = new Telerik.Web.UI.jSlide(element, expandAnimation, collapseAnimation, false);  
        
                        slide.initialize();  
        
                        slide.set_direction(direction);  
        
                        slider.onclick = function() {  
        
                            element.parentNode.style.visibility = "visible";  
        
                            element.parentNode.style.display = "block";  
        
                            if (!expanded) {  
        
                                slide.expand();  
        
                            }  
        
                            else {  
        
                                slide.collapse();  
        
                            }  
        
                            expanded = !expanded;  
        
                            return false;  
        
                        }  
        
                    }  
        
                </script> 
        
                </form> 
        
            </body> 
        
            </html>

All the best,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.