Wie legen Sie die Jquery-Tabs auf 100% Höhe?

Question

Wie legen Sie die Jquery-Tabs auf 100% Höhe?

ich muss auch die Größe des iframe innerhalb es auf 100% Höhe zu erweitern.

danke!

Answer 1

haben Sie versucht, Einstellhöhe Eigenschaft versuchen Sie es mit CSS-Methode:

$("#ID OF YOUR TAB ELEMENT").css("height","100%"); 

Answer 2

Sie ein div mit der Höhe verwenden können: 100% die Registerkarte Inhalt haben erweitern, um die gesamte Bildschirmhöhe zu decken.

Für iframe Größenanpassung siehe here.

Answer 3

Ich glaube nicht, dass Sie es zuverlässig (cross-Browser) mit nur CSS tun können.

Vielleicht sollten Sie Jquery verwenden, um die Höhe der Seite zu bekommen und jedes Element so eingestellt:

$(window).resize(function() { 
    var wh = parseInt($(window).height()); 

    if ($.browser.opera) { 
     wh = $.browser.version > "9.5" ? document.documentElement["clientHeight"] : wh; 
    } 

    $('#elementid').css("height", wh); 
}); 

Answer 4

die UI Tabs, um die Größe (neueste Version 1.7.2, zumindest), arbeitete sie mit der folgenden Code:

$ (document).ready (function() { 
function resizeUi() { 
    var h = $(window).height(); 
    var w = $(window).width(); 
    $("#tabs").css('height', h-95); 
    $(".ui-tabs-panel").css('height', h-140); 
}; 

var resizeTimer = null; 
$(window).bind('resize', function() { 
    if (resizeTimer) clearTimeout(resizeTimer); 
    resizeTimer = setTimeout(resizeUi, 100); 
}); 
resizeUi(); 
} 

plus die flollowing css:

#tabs { 
    display: inline-block; 
    width:325px; 
} 

Sie wil müssen einige numbe bearbeiten rs nach Ihren Bedürfnissen.

Answer 5

Wenn es jemals jemand anderen nutzen kann, habe ich einige Callbacks zu "show" und "add" hinzugefügt, um immer eine perfekte Höhe zu bekommen. In meinem Fall hat der obere Container die Klasse "ui-layout-pane" (wie ich jquery-Layouts verwende), aber das sollte mit jeder Klasse funktionieren.