mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
54 lines
1.2 KiB
HTML
54 lines
1.2 KiB
HTML
|
<script type="text/javascript">
|
||
|
|
|
||
|
|
var model = {
|
||
|
|
|
||
|
|
renderAt: '#containerDemo',
|
||
|
|
|
||
|
|
title: 'Tabs Demos',
|
||
|
|
|
||
|
|
demos: [
|
||
|
|
|
||
|
|
{
|
||
|
|
title: 'Simple Tabs',
|
||
|
|
desc: 'With few lines of code you could make tabs. You can try more options on the fly!',
|
||
|
|
html: { url: 'templates/ui.tabs.ex1.html' },
|
||
|
|
destroy: '$("tabsEx1 > ul").tabs("destroy");',
|
||
|
|
options: [
|
||
|
|
{
|
||
|
|
desc: 'First tab active by default',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs();'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
desc: 'Start With Custom Tab',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs({selected:1});'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
desc: 'Use a slide effect to switch tabs',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs({ fx: { height: "toggle" } });'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
desc: 'Use a fade effect to switch tabs',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs({ fx: { opacity: "toggle" } });'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
desc: 'Use a combined slide and fade effect to switch tabs',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs({ fx: { height: "toggle", opacity: "toggle" } });'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
desc: 'Define event to switch tabs (mouseover)',
|
||
|
|
source: '$("#tabsEx1 > ul").tabs({ event: "mouseover" });'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
|
||
|
|
]
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
$(function(){
|
||
|
|
|
||
|
|
uiRenderDemo(model);
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
</script>
|