Javascript Jquery选项卡跳跃和高度
我在jquery选项卡上遇到了一个问题,它与这里已经解决的以下问题非常相似: 我做了以下操作,因此单击选项卡时的跳跃发生了变化 但问题是,我的content div上的文本长度差别很大,我的布局中有一个页脚,因此如果我单击文本最多的选项卡,然后单击文本较少的选项卡,文本和页脚之间会有一个巨大的间隙。 是否存在这样的可能性,即当您单击某个选项卡时,高度总是精确地调整到文本的长度,而不是保持最高 我希望我的问题是可以理解的,我真的很感谢你的帮助 以下是我的例子: jquery是:Javascript Jquery选项卡跳跃和高度,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我在jquery选项卡上遇到了一个问题,它与这里已经解决的以下问题非常相似: 我做了以下操作,因此单击选项卡时的跳跃发生了变化 但问题是,我的content div上的文本长度差别很大,我的布局中有一个页脚,因此如果我单击文本最多的选项卡,然后单击文本较少的选项卡,文本和页脚之间会有一个巨大的间隙。 是否存在这样的可能性,即当您单击某个选项卡时,高度总是精确地调整到文本的长度,而不是保持最高 我希望我的问题是可以理解的,我真的很感谢你的帮助 以下是我的例子: jquery是: $(docum
$(document).ready(function() {
$(".tab_content").hide(); //Hide all content
$(".tabs li:first").addClass("current").show();
$(".tab_content:first").show();
$(".tabs li").click(function() {
$(".tabs li").removeClass("current");
$(this).addClass("current");
$('.tab_container').css('min-height', $('.tab_container').height()+'px');
$(".tab_content").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
});
});
选项卡容器高度应大于活动内容高度。 您应该尝试以下方法:
$(".tabs li").click(function() {
$(".tabs li").removeClass("current");
$(this).addClass("current");
var activeTab = $(this).find("a").attr("href");
var h = $(activeTab).height() + 20;
$('.tab_container').css('height', h + 'px');
$(".tab_content").hide();
$(activeTab).fadeIn();
return false;
});
给我们看一下你的代码/小提琴对不起,你能再看一下我的代码吗?很遗憾,我刚刚把它改成了正确的形式。问题是在做一把小提琴或把它扔进垃圾箱的时候,否则去一个网站找出具体的问题是非常麻烦的,因为里面也会有很多数据。为什么你要更改tab_容器的最小高度而不是实际高度?如果我更改实际高度,If的内容会浮在页脚上谢谢,这似乎是可行的,但当我向下滚动一点并点击一个新的标签时,它仍然有点跳跃。你说的“跳跃”是什么意思?也许是因为法丹效应尝试使用$(activeTab.show();你也可以在函数中稍微调整一下命令的顺序来改善情况……是的,但我觉得我现在很好。看起来不错,非常感谢!