UIZE JavaScript Framework

JAVASCRIPT EXAMPLES Tabbed Interface With Fade

In this example, the markup for a tabbed interface is being wired up by an instance of Uize.Widget.Options.Tabbed. Below the tabs are some links that execute snippets of code to demonstrate the programmatic interface of the widget. Because the tabs widget is a subclass of Uize.Widget.Options, it provides a value state property in its interface. The Changed.value instance event for this property can be used to watch for changes in the selected tab. The property can be set to programmatically change the selected tab. Interact with both the tabs UI and the test links to see how they affect one another. Switching from one tab to another is accompanied by a JavaScript animation transition effect.


tabs.get ('value') == ''

tabs.get ('tentativeValue') == ''

Set the value for the tabs widget: tabs.set ({value:'apples'})  ,  tabs.set ({value:'grapefruits'})  ,  tabs.set ({value:'mangos'})  ,  tabs.set ({value:'plums'})  ,  tabs.set ({value:'strawberries'})