Height toekennen dmv jQuery

  • Beste ICT'ers,


    Ik zit met een vreemd probleem.
    Op de volgende manier ken ik height toe aan verschillende divs:


    Code
    var height = $(window).height();
    var container = height / 5 * 3 + "px";
    $('#container').attr('height',container);


    Nu wordt de div niet groter, maar als ik via google chrome in de broncode kijk zie ik wel de juiste height staan (Zie bijlage).


    Weet iemand hoe dit kan? Alvast bedankt!

  • Guest, wil je besparen op je domeinnamen? (ad)
  • Jazeker kan ik dat ;).


    De jQuery functie "attr" werkt op alle attributen. Dit kunnen standaard attributen zijn (dus bijv. src, alt, title, id e.d.) maar ook eigen verzonnen zijn (xHTML valid als ze beginnen met data-). De attributen style en class zijn twee bijzondere attributen die een eigen vorm van wijzigen hebben. Style gaat met de jQuery functie .css en de classes gaan met de functies .addClass en .removeClass. Het attribuut wat jij probeert te bewerken, height, is een ouderwets attribuut dat men gebruikte in plaats van CSS. Tegenwoordig is het gebruik van CSS vereist en eigenlijk verplicht voor een goede crossbrowser weergave. Daarom gaan stylingselementen zoals width, height, border en noem maar op langzamerhand verdwijnen en niet meer geldig worden in websites. jQuery is een framework dat zich richt op de toekomst en heeft daarom besloten dat zij die attributen niet meer gaan wijzigen/toevoegen met hun functies. Daarom moet je dus het CSS alternatief gebruiken en dat is in jouw geval style="height: 300px;". Dat doe je dus met .css("height", "300px"). Waarom hij wel in de broncode komt durf ik niet precies te zeggen, maar waarschijnlijk omdat jQuery de code wel toevoegt maar hem simpelweg niet meer laten executen door de browser interpreter.


    Hoop dat je het zo snapt ;).


    Groet,


    Lars

  • Div ondersteunt simpelweg het attribuut height niet, alleen de global attributes (zoals id, class, enz.). Om de div hoger te maken is de enige oplossing dus om css te gebruiken. jQuery zet er wel een attribuut bij maar dat is gewoon een fout in je html code.

Participate now!

Heb je nog geen account? Registreer je nu en word deel van onze community!