Question

我正在使用来自此SITE的jquery滑动标签，这非常好用。唯一的问题是autoHeight jquery函数不适应扩展内容。 改述：标签容器将调整到非活动内容的高度，但问题是，一旦容器内的内容变为活动状态并且垂直扩展，它将不再适合并且不会被看到＆lt; ---它无法适应这一点。以下是示例JSFFIDLE

我尝试这样做以调整高度以扩展内容但不起作用：

<script>
 var height = 50 // Set to the height you want
        $('.st_view').css('height', height+'px')

    });

    </script>

整体Jquery

 <script>

    $(document).ready(function() {

        $('div#st_horizontal').slideTabs({
            // Options              
            contentAnim: 'slideH',
            autoHeight: true,
            contentAnimTime: 600,
            contentEasing: 'easeInOutExpo',
            tabsAnimTime: 300
        });

        var height = 50 // Set to the height you want
        $('.st_view').css('height', height+'px')

    });

    </script>

Answer 1

如果只是导致内容扩展的切换器，您可以像这样修改切换器代码：

$('#title').click(function() {
    $(this).toggleClass('active');
    $('#content').toggle();
    var $tab = $(this).closest('.st_tab_view');
    $tab.closest('.st_view').css('height', $tab.height());
});

要获得更通用的解决方案，请获取jQuery resize plugin，然后添加以下代码：

$('.st_tab_view').resize(function() {
    var $this = $(this);
    $this.closest('.st_view').css('height', $this.height());
});

Jquery选项卡：autoHeight用于扩展内容

1 个答案: