width ක්රමය
width ක්රමය මූලද්රව්යයක පළල ලබා ගැනීමට
සහ වෙනස් කිරීමට ඉඩ සලසයි. මතක තබා ගත යුත්තේ, අප
ලබා ගන්නේ පළලේ 'ගණනය කළ අගය'
(computed width) බවයි.
css('width')
ක්රමයට වඩා වෙනස්ව, එය මාන රහිත අගයක් ලබා දෙයි (උදාහරණයක් ලෙස 400)
සහ ගණිතමය ගණනය කිරීම් සඳහා පහසුය.
ක්රමය මූලද්රව්යයේ අන්තර්ගතයේ පළල ලබා ගනී, එය
box-sizing CSS ගුණාංගය
විශේෂණය කර තිබුණත් නොසලකා. මේ සම්බන්ධ
අපහසුතා වළක්වා ගැනීමට,
css('width') භාවිතා කිරීම නිර්දේශ කෙරේ.
පරිශීලක පිටුවේ ප්රමාණය වෙනස් කරන විට, එසේම,
මූලද්රව්යය හෝ එහි මාපිය මූලද්රව්යය සඟවා ඇති විටද
ගණනය කිරීමේ දෝෂ ඇති විය හැක. පළලේ අගය
අතර ඉඩ සහ මායිමේ අගයන් සැලකිල්ලට නොගනී.
වාක්ය රීතිය
මූලද්රව්යයක පළල ලබා ගන්න. සමහර අවස්ථාවලදී ලබාගත් අගයන් භාගික විය හැක:
$(තෝරන්නා).width();
මූලද්රව්යයේ පළල වෙනස් කිරීම සඳහා - සරලව
අංකයක් යැවිය හැක (උදාහරණයක් ලෙස 400), එවිට මිනුම්
ඒකකය පික්සල් වනු ඇත, නැතහොත් අනෙක් අතට,
මිනුම් ඒකකය සඳහන් කරමින් නූලක් (උදාහරණයක් ලෙස
'10em'):
$(තෝරන්නා).width(නව අගය);
එසේම අපට නියමිත ශ්රිතයක් කට්ටලයේ එක් එක්
මූලද්රව්යයට යොදාගත හැක. මෙහිදී පළමු පරාමිතිය ලෙස ශ්රිතය
ලබා ගන්නේ කට්ටලය තුළ මූලද්රව්යයේ අංකය වන අතර, දෙවන පරාමිතිය
ලෙස - නිශ්චිත මූලද්රව්යය සඳහා නියම කරන ලද පළලේ වත්මන් අගය වේ.
ශ්රිතය තුළ this අගය
වත්මන් මූලද්රව්යය යොමු කරයි.
මූලද්රව්යයේ පළලේ අගය වෙනස් වන්නේ,
ශ්රිතය ආපසු ලබා දෙන අගයට ය:
$(තෝරන්නා).width(function(කට්ටලය තුළ අංකය, පළලේ වත්මන් අගය));
උදාහරණය
අපි div මත ක්ලික් කිරීමේදී එහි
පළල 40px අගයට වෙනස් කරමු,
width ක්රමය භාවිතා කරමින්, එසේම css
භාවිතයෙන් එහි පසුබිම කොළ පැහැයට වෙනස් කරමු:
<div id="test"></div>
#test {
width: 90px;
height: 80px;
background: red;
color: white;
margin-top: 10px;
cursor: pointer;
}
$('#test').one('click', function() {
$(this).width(40).css({
cursor: 'auto',
backgroundColor: 'green'
});
});
මෙයද බලන්න
-
heightක්රමය,
මූලද්රව්යයක උස ලබා ගැනීමට සහ වෙනස් කිරීමට ඉඩ සලසයි -
innerWidthක්රමය,
මූලද්රව්යයේ අභ්යන්තර ඉඩ සැලකිල්ලට ගනිමින්, එහි පළල ලබා ගැනීමට සහ වෙනස් කිරීමට ඉඩ සලසයි -
outerWidthක්රමය,
මූලද්රව්යයේ ඉඩ සහ මායිම සැලකිල්ලට ගනිමින්, එහි පළල ලබා ගැනීමට සහ වෙනස් කිරීමට ඉඩ සලසයි -
cssක්රමය,
මූලද්රව්යයේ CSS විලාසයන් ලබා ගැනීමට සහ වෙනස් කිරීමට ඉඩ සලසයි
