我正在使用jQuery UI选项卡来创建页面的垂直选项卡部分,并希望最后一个垂直选项卡链接到URL而不是加载选项卡面板.
有关最佳方法的建议吗？我可以将除了LI之外的另一个元素添加到列表中,但是宁愿让最后的li只是表现不同.
谢谢你的帮助.
这是我的javascript:
// vtabs
$("#aboutprod-tabs").tabs(
{ fx: [{opacity:'toggle', duration:'normal'},
{opacity:'toggle', duration:'fast'}] })
.addClass('ui-tabs-vertical');
和HTML
<div id="aboutprod-tabs">
<ul>
<li><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">3rd</a></li>
<li class="last"><a href="/products">Learn more...</a></li>
</ul>
<div id="tabs-1">
Tab panel 1
</div>
<div id="tabs-2">
Tab panel 2
</div>
<div id="tabs-3">
Tab panel 3
</div>
</div>
在以前的版本中,jQuery tabs有一个选项可以使用以下选项自动将选项卡的高度设置为组中最高选项卡的高度:
$('#container').tabs({ fxAutoHeight: true });
然而,这似乎不起作用jQuery UI 1.5.3.
此选项已被删除吗？如果是这样,有另一种方法来获得相同的功能？
有没有人一起使用了tabs(jquery-ui-1.8.9)和饼图Highcharts 2.1.4？简单来说,我有多个标签,每个标签显示一个包含不同数据的饼图.图表会渲染到div,但是当我点击第二个标签时,图表会以某种方式显示300px在它所假设的位置的右侧.每当我放大或缩小浏览器窗口时,图表都会返回到校正位置.
我的代码:
//假设数字选项卡是基于变量$ count生成的,并且有2个选项卡
<script type="text/javascript">
var chart_tab_<?=count?>;
$(document).ready(function() {
chart_tab_<?=count?> = new Highcharts.Chart({
chart: {
renderTo: 'chart_tab_<?=count?>',
// blah blah
}
<body>
<div id="chart_tab_<?=count?>"></div>
</body>
再次,图表呈现,但在第二个选项卡上显示错误.
更新:我知道这个KIND OF解决了这个问题:
<script type="text/javascript">
$(document).ready(function() {
$( "#tabs" ).tabs({
cookie: { expires: 1 }
});
$( "#tabs" ).tabs({
select: function(event, ui) { window.location.reload(); }
});
});
但它真的很糟糕,因为每次用户点击选项卡时都必须重新加载页面.任何想法都会很棒.
我为这是一个开放式问题而道歉,但我不知所措.
从jquery UI的1.9版开始,他们使用该cookie选项进行折旧,以便在多个页面中保存选项卡的活动状态.http://jqueryui.com/upgrade-guide/1.9/#deprecated-cookie-option
我还没有看到任何关于如何实现这一目标的其他文档!所以我一直在挠头.
我最好的猜测是使用某种方法event创建一个cookie,然后加载cookie？或者是否有其他方法可以跨多个页面和用户首选项保存选项卡的活动状态？
我想在活动的jQuery UI选项卡上删除大纲(或至少更改颜色).
从这个例子开始,我尝试了这个失败:
<style>
#tabs .ui-state-focus
{
outline: none;
}
</style>
(基于这个问题和答案的提示).
从活动标签中删除轮廓的诀窍是什么？
我在jQuery UI对话框窗口中使用jQuery UI选项卡.
我遇到过一个实例,我需要在单击其中一个对话框按钮时找到当前选项卡的ID.看看jQuery UI选项卡和对话框生成的HTML,我真的找不到这样做的方法.<ul>保持选项卡的元素<div>距离对话框按钮组约3 秒.
我试过了:
$("#DialogBox").dialog({
autoOpen: false,
modal: true,
buttons: [
{
text: "Save",
click: function () {
var currentTabId = $(this).closest("ul").attr("id");
alert(currentTabId);
但我只是得到了一个"未定义"的警报.
有办法做到这一点吗？
谢谢
在我的应用程序中,我到目前为止都避免需要加载任何jQuery样式表,但UI-tabs插件似乎需要一些CSS才能工作.好的,很好,但是这些示例可以加载所有UI样式,或许更重要的是,标签样式完全破坏了我自己的外观和感觉.
有没有地方可以学习如何为标签提供足够的CSS工作,所以我可以保留自己的样式？
我不介意最小量的造型有助于很好地安排标签或其他东西,但背景图片,颜色......他们与我自己的造型冲突非常糟糕.
哦,不用了主题滚筒,我相信这对某些人来说很好.只是不在这种情况下,谢谢.
我正在使用jquery ui标签,并使用.tabs('add'...)动态添加标签.选项卡使用ajax加载URL.问题是每次我点击另一个标签然后回来...标签重新加载网址.我希望网址加载一次....任何想法？
我在我的网站上的两个页面上有这个代码,但在一个页面上该功能不起作用.Firebug向我展示"$(...).制表符不是函数".我不明白为什么,谁能告诉我什么是错的？
这是有效的:http: //www.invat-online.net/variante-rezolvate
这不起作用:http: //www.invat-online.net/variante-explicate-limba-romana/varianta-01
这是代码:
<div id="tabss">
<ul>
<li><a href="#SubiectI">Subiect I</a></li>
<li><a href="#SubiectII">Subiect II</a></li>
<li><a href="#SubiectIII">Subiect III</a></li>
</ul>
<div id="SubiectI">content here</div>
<div id="SubiectII">content here</div>
<div id="SubiectIII">content here</div>
</div>
$(document).ready(function() {
$("#tabss").tabs();
});
我正在将代码从jQuery UI 1.8升级到1.10.
在1.8下,当选项卡更改时触发事件select,并且我可以访问通过选择的选项卡的索引ui.index.
在1.10下,选项卡更改时触发的事件是activate.但是,我在event参数ui中找不到任何告诉我新激活的选项卡索引的内容.
我该如何发现该索引？
jquery-ui-tabs ×10
jquery-ui ×7
jquery ×6
css ×2
tabs ×2
cookies ×1
dhtml ×1
highcharts ×1
javascript ×1
jquery-tabs ×1