javascript - Jquery Tabs跳跃和高度

Question

我遇到了 jquery 选项卡的问题，它与这里已经解决的以下问题非常相似：

点击这里查看网站

我做了以下操作，因此单击选项卡时的跳跃发生了变化。

但问题是，我的内容 div 上的文本长度差异很大，我的布局中有一个页脚，所以如果我单击文本最多的选项卡，然后单击文本较少的选项卡，就会有一个巨大的文本和页脚之间的间隙。当您单击某个选项卡时，是否有可能高度总是真正精确地调整到文本的长度并且不会保持最高？

我希望我的问题是可以理解的，我非常感谢您的帮助。

这是我的例子：

http://crossmediasolutions.de/cmsweb/index.htm

jQuery是：

$(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;
    });
});

Answer 1

您的 tab_container 高度应该大于您的活动内容高度。你应该尝试这样的事情：

$(".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;
    });