Metoda width

Metoda width lejon marrjen dhe ndryshimin e gjerësisë së elementit. Është e rëndësishme të kujtohet se ne do të marrim 'vlerën e llogaritur' të gjerësisë (computed width). Ndryshe nga metoda css('width'), ai kthen një sasi pa dimension (për shembull 400) dhe është i përshtatshëm për llogaritjet matematikore. Metoda merr gjerësinë e përmbajtjes së elementit, pavarësisht nga përcaktimi i vetive CSS box-sizing. Për të shmangur vështirësitë që lidhen me këtë, rekomandohet përdorimi i css('width'). Gabimet në llogaritje mund të ndodhin gjithashtu nëse përdoruesi ndryshon përmasat e faqes, si dhe, nëse elementi ose prindi i tij janë të fshehur. Vlera e gjerësisë nuk merr parasysh vlerat e hapësirave dhe kornizës.

Sintaksa

Merrni gjerësinë e elementit. Në disa raste vlerat e marra mund të jenë thyesore:

javascript$(selector).width();

Për të ndryshuar gjerësinë e elementit - mund të kaloni thjesht një numër (për shembull 400), atëherë njësitë e matjes do të jenë pixel, ose një varg, me përcaktimin e njësive të matjes (për shembull '10em'):

javascript$(selector).width(vlera e re);

Gjithashtu ne mund të aplikojmë një funksion të caktuar për çdo element në grup. Në këtë rast, parametri i parë i funksionit do të marrë numrin e elementit në grup, dhe parametri i dytë - vlerën aktuale të gjerësisë së caktuar për elementin specifik. Vlera this brenda funksionit do të tregojë elementin aktual. Vlera e gjerësisë së elementit do të ndryshojë në atë që kthen funksioni:

javascript$(selector).width(function(numri në grup, vlera aktuale e gjerësisë));

Shembull

Le të ndryshojmë gjerësinë e div në vlerën 40px duke përdorur metodën width, dhe gjithashtu duke përdorur css ta ndryshojmë sfondin e tij në të gjelbër:

html<div id="test"></div>

css#test {
  width: 90px; 
  height: 80px;
  background: red; 
  color: white;
  margin-top: 10px; 
  cursor: pointer;
}

javascript$('#test').one('click', function() {
  $(this).width(40).css({
    cursor: 'auto',
    backgroundColor: 'green'
  });
});

Shihni gjithashtu