wie legen Sie den jquery-tabs, um die form einer 100% Höhe?

wie legen Sie den jquery-tabs, um die form einer 100% Höhe?

brauche ich auch, um die Größe des iframe innerhalb es zu erweitern, um 100% der Höhe.

danke!

etwas code würde es leichter machen, um zu sehen, was Los ist...CSS und HTML-markup der Elemente diskutiert.

InformationsquelleAutor | 2009-07-24

  1. 6

    Ändern Sie die Größe der UI-Tabs (neuste 1.7.2 version zumindest), klappte es mit dem 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 haben, Bearbeiten einige zahlen nach, die Sie braucht.

    Hatte vergessen den IFRAME. Fügen Sie einfach diese Zeile $("iframe#myiframe").css('height', h-95 ); am Ende der Funktion oben, und ändern Sie die "95" - Wert. könnte 0 sein, in der Sie Fall.

    InformationsquelleAutor Omiod

  2. 3

    Wenn überhaupt, kann es von nutzen sein für jemand anderen, ich habe einige Rückrufe zu "zeigen" und "hinzufügen", um immer eine perfekte Höhe. In meinem Fall sind die top-container mit der Klasse "ui-layout-Bereich" (wie ich die jquery-layouts), aber das sollte funktionieren mit jeder Klasse.

    myTab = $("#tabs").tabs({
    show: function(e,ui){
        var $c = $(ui.panel), h = parseInt($(ui.tab).parent().outerHeight());
        while ( $c.length > 0 && !$c.hasClass("ui-layout-pane") ){
            h += ( $c.outerHeight(true) - $c.innerHeight() );
            $c = $c.parent();
        }
        h = parseInt($c.innerHeight() - h );
        $(ui.panel).height(h);
        return true;
    },
    add: function(e,ui){
        $(this).tabs("select",ui.index);
    }
});
    Das hat Super funktioniert!
    In der "show" - Veranstaltung, die ich hatte, zu ändern $(ui.panel).height(h); zu $(ui.panel).parent().height(h); - und es funktionierte! JQuery UI-v1.8.14.

    InformationsquelleAutor Nabab

  3. 0

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

    Vielleicht solltest du jquery verwenden, um die Höhe der Seite, und legen Sie jedes element so:

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

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

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

    InformationsquelleAutor user142360

  4. -2

    Können Sie einen div mit height:100% auf die Registerkarte Inhalt, erweitern Sie decken die gesamte Bildschirm-Höhe.

    Für iframe resizing sehen hier.

    schon haben die 100% Höhe für alle html -, Körper - & div. aber noch im in kein Glück. die iframe-trick auch nicht funktioniert. irgendwelche anderen Vorschläge?
    btw, im erzeugen der iframe über .html()

    InformationsquelleAutor kgiannakakis

  5. -3

    haben Sie versucht, versuchen, die Einstellung der height-Eigenschaft mit CSS-Methode:

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

    InformationsquelleAutor TheVillageIdiot

Schreibe einen Kommentar