jquery ui tab at both top and bottom
I would like to have a Jquery UI tab with top and button menu function, is it possible to do that ? (the content are loaded via ajax ,what i mean is the top tab and bottom tab both at the same time.)
<script type="text/javascript" charset="utf-8">
$(function() {
$( "#tabs" ).tabs({
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html(
"Couldn't load this tab. We'll try to fix this as soon as possible. " +
"If this wouldn't be a demo." );
}
},
cookie: {
// store cookie for a day, without, it would be a session cookie
expires: 1
}
});
});
</script>
<div id="tabs">
<ul id="top">
<li><a href="top1.php">to开发者_运维技巧p 1</a></li>
<li><a href="top2.php">top 2</a></li>
</ul>
<ul id="bottom">
<li><a href="bottom.php">bottom 1</a></li>
<li><a href="bottom.php">bottom 2</a></li>
</ul>
</div>
Thank you in advance!
I am a bit confused about what you want to achieve, but if you are trying to make similiar layout as I am in jQuery UI tabs - how to change tab position ,then if you dont mind having the tabs layout of fixed height, then you can simply move the tabs by css as I did here http://jsfiddle.net/L6QjK/2/
If you DO mind the fixed height, my only idea so far is to create layout with one control panel, than add some <div>
looking as control panel and move some tabs after initialization from the code by usinge something like this:
$("#yourFakeControlPanel").append($(".ui-tabs-nav").find("#yourTab"));
$(".ui-tabs-nav").find("#yourTab").remove();
This was working when all the tabs were static, but I have ran to some errors, when adding new tabs dynamicaly, so consider this as a hint not as an exact answer
I think i have finaly found your answer. Look to my post, I have written there how to make tabs on the top and bottom same time jQuery UI tabs - how to change tab position
and if zou find this helpful, mark this as an answer to lead others to the right sollution
精彩评论