jQuery o‘lchamlar
jQuery yordamida elementlar va brauzer oynasining o‘lchamlari bilan ishlash oson.
jQuery o‘lcham metodlari
jQuery’da o‘lchamlar bilan ishlash uchun bir nechta muhim metod mavjud:
width()height()innerWidth()innerHeight()outerWidth()outerHeight()
jQuery o‘lchamlar
jQuery width() va height() metodlari
width() metodi elementning kengligini o‘rnatadi yoki qaytaradi (padding, border va margin hisobga olinmaydi).
height() metodi elementning balandligini o‘rnatadi yoki qaytaradi (padding, border va margin hisobga olinmaydi).
Quyidagi misol belgilangan <div> elementining kengligi va balandligini qaytaradi:
Misol
$("button").click(function(){
var txt = "";
txt += "Width: " + $("#div1").width() + "</br>";
txt += "Height: " + $("#div1").height();
$("#div1").html(txt);
});
O‘zingiz sinab ko‘ring »
jQuery innerWidth() va innerHeight() metodlari
innerWidth() metodi elementning kengligini qaytaradi (padding hisobga olinadi).
innerHeight() metodi elementning balandligini qaytaradi (padding hisobga olinadi).
Quyidagi misol belgilangan <div> elementining ichki kengligi/balandligini qaytaradi:
Misol
$("button").click(function(){
var txt = "";
txt += "Inner width: " + $("#div1").innerWidth() + "</br>";
txt += "Inner height: " + $("#div1").innerHeight();
$("#div1").html(txt);
});
O‘zingiz sinab ko‘ring »
jQuery outerWidth() va outerHeight() metodlari
outerWidth() metodi elementning kengligini qaytaradi (padding va border hisobga olinadi).
outerHeight() metodi elementning balandligini qaytaradi (padding va border hisobga olinadi).
Quyidagi misol belgilangan <div> elementining tashqi kengligi/balandligini qaytaradi:
Misol
$("button").click(function(){
var txt = "";
txt += "Outer width: " + $("#div1").outerWidth() + "</br>";
txt += "Outer height: " + $("#div1").outerHeight();
$("#div1").html(txt);
});
O‘zingiz sinab ko‘ring »
outerWidth(true) metodi elementning kengligini qaytaradi (padding, border va margin hisobga olinadi).
outerHeight(true) metodi elementning balandligini qaytaradi (padding, border va margin hisobga olinadi).
Misol
$("button").click(function(){
var txt = "";
txt += "Outer width (+margin): " + $("#div1").outerWidth(true) + "</br>";
txt += "Outer height (+margin): " + $("#div1").outerHeight(true);
$("#div1").html(txt);
});
O‘zingiz sinab ko‘ring »
jQuery width() va height() haqida qo‘shimcha
Quyidagi misol hujjat (HTML hujjati) va oyna (brauzerning ko‘rinish maydoni — viewport) kengligi va balandligini qaytaradi:
Misol
$("button").click(function(){
var txt = "";
txt += "Document width/height: " + $(document).width();
txt += "x" + $(document).height() + "\n";
txt += "Window width/height: " + $(window).width();
txt += "x" + $(window).height();
alert(txt);
});
O‘zingiz sinab ko‘ring »
Quyidagi misol belgilangan <div> elementining kengligi va balandligini o‘rnatadi:
jQuery mashqlari
jQuery CSS ma’lumotnomasi
Barcha jQuery CSS metodlari bo‘yicha to‘liq ma’lumot uchun jQuery HTML/CSS ma’lumotnomasiga o‘ting.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!