We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to disable all animations in the tab control, and style the borders of the control


How do I disable all animations for the tab control ? are there any default styles that add borders to the tab content ?
Where can I find examples of usage of TabTabAnimationSettings ? (accepted values for Previous and Next/TModel members).

Thanks !

3 Replies

NR Nevitha Ravi Syncfusion Team April 24, 2019 09:01 AM

Hi Moez, 

Greetings from Syncfusion Support. 

To disable the animation effects in tab component kindly refer the following code. 
    <ejs-tab id="defaultTab" animation="ViewBag.animation"> 
            <e-tab-tabitem header="ViewBag.headerTextOne" content="witter is an online social networking service that enables users to send and read short 140-character messages called tweets."></e-tab-tabitem> 
            <e-tab-tabitem header="ViewBag.headerTextTwo" content="Facebook is an online social networking service headquartered in Menlo Park, California"></e-tab-tabitem> 
            <e-tab-tabitem header="ViewBag.headerTextThree" content="WhatsApp Messenger is a proprietary cross-platform instant messaging client for smartphones that operates under a subscription business model."></e-tab-tabitem> 

var obj1 = new TabNextTab { Effect = "none" }; 
ViewBag.animation = new TabTabAnimationSettings { Next = obj1 , Previous =  obj1  }; 

There is no default styles to add the border to content but we can achieve it through CSS which can be referred from the following sample.  

.e-tab .e-content > .e-item.e-active { 
        border: 1px solid #969696; 

Please let us know if you need any further assistance. 


MO moez April 25, 2019 11:40 PM

Thank you Nevitha !
As a general rule, where can I find a reference for the acceptable types for the properties of any syncfusion component ?
For instance, where would I find the type definition of the Model used for the animation property ?

Thanks !

NR Nevitha Ravi Syncfusion Team April 26, 2019 02:14 AM

Hi Moez, 

Thanks for your update. 

You can get the type definition of a modal property in our API documentation. We have shared UG link for animation property in the following link. 


Live Chat Icon For mobile
Up arrow icon