Nastavenie výšky dvoch prvkov dynamicky pomocou jquery - jquery, css

Mám sekciu ako - <section id="left_side"> //Some crap here.</section> a takýto prvok - <aside id="right_side"> //Some crap here.</aside>

Čo chcem urobiť je, keď je výška kontajnera väčšia ako kontajner, a potom pomocou jQuery chcem, aby bola jeho výška roztiahnutá a bola väčšia alebo rovna kontajneru.

Ale zároveň, ak je stranou menšia ako kontajner sekcie, chcem, aby bola výška rozšírená a rovná sa kontajneru sekcie.

Nemám absolútnu predstavu, ako to urobiť pomocou jQuery.

odpovede:

1 pre odpoveď č. 1
$(".section-container").on("adjustNeighbors", "#leftside,#rightside", function () {
var thisHeight = $(this).outerHeight();
var sectionToResize = $(this).is("#leftside") ? "#rightside" : "#leftside";

$(sectionToResize).css("height", thisHeight + "px");
});

A spustite to tak ..

function someFunction(){
// some code that resized #leftside or #rightside
thatSection.trigger("adjustNeighbors");
}

0 pre odpoveď č. 2
function resize_section_aside() {
var section = $("leftside"),
aside = $("rightside"),
section_height = section.height(),
aside_height = aside.height();
if( aside_height > section_height ) {
section.height( aside_height );  // re-size section to aside
} else {
aside.height( section_height );   // re-size aside to section
}
});
}

$(function() {
resize_section_aside();
});

Vyšší kód bude strieľať na DOM dokončiť zaťaženie. Ak potrebujete akúkoľvek udalosť na požiar, stačí zavolať resize_section_aside() v rámci daného obslužného programu udalostí.


Ponuka