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

animation not working on window in asp.net mvc

1 Answer 197 Views
Window
This is a migrated thread and some comments may be shown as answers.
Liza
Top achievements
Rank 1
Liza asked on 09 Oct 2012, 07:19 PM
i cannot get the animation effects on open and close working. 
Im using the following code: 
@{
    Html.Kendo().Window()
        .Name(winname)
        .Title(title)
        .Events(builder => builder.Close("KendoWinOnClose").Open("KendoWinOnLoad"))
        .Actions(builder=> builder.Close().Maximize().Minimize())
       .Animation(x=> x.Close(builder => builder.Fade(FadeDirection.Out)).Open(builder => builder.Fade(FadeDirection.In)).Enable(true))
        .Content(@<text>
                      
                      
                     <script type="text/javascript" language="javascript">
                         function KendoWinOnClose() {
                              $("#@winname").data("kendoWindow").destroy();
                           
                       }


                       function KendoWinOnLoad() {
                            $("#@winname").data("kendoWindow").center();
                      }


                   </script>
      
                      <p>
                          Alvar Aalto is one of the greatest names in modern architecture and design.
                          Glassblowers at the iittala factory still meticulously handcraft the legendary
                          vases that are variations on one theme, fluid organic shapes that let the end user
                          ecide the use. Interpretations of the shape in new colors and materials add to the
                          growing Alvar Aalto Collection that remains true to his original design.
                      </p>
 
                  </text>)
        .Draggable()
        .Resizable()
        .Width(width)
        .Height(height)
        .Modal(modal)
        .Resizable(x => x.Enabled(true))
        .Render();
}



any ideas ?

1 Answer, 1 is accepted

Sort by
0
Accepted
Petur Subev
Telerik team
answered on 12 Oct 2012, 12:56 PM
Hello Liza,

There are two different reasons for the different animations not to work.
  1. The window is initially visible - which means the window and its content will be visible when the page has finished loading. To show the animation to the user you can make the window initially hidden and open it when the document has finished loading.
    @{
        Html.Kendo().Window()
            .Name("test")
            //...
            .Visible(false)
            .Render();
    }
     
     
    <script type="text/javascript">
        $(function () {
            $('#windowName').data().kendoWindow.open()
        })
    </script>
  2. The closing animation is not visible because in your close handler you destroy the window and thus the window is removed before the animation has even started. I would suggest you to use the deactivate event instead.
    .Events(builder => builder.Deactivate("KendoWinOnClose").Open("KendoWinOnLoad"))

Kind Regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Window
Asked by
Liza
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Share this question
or