width()
jQuery width() metodi
Misol
<div> elementining kengligini qaytarish:
$("button").click(function(){
alert($("div").width());
});
O‘zingiz sinab ko‘ring »
Ta’rif va qo‘llanilishi
width() metodi tanlangan elementlarning kengligini o‘rnatadi yoki qaytaradi.
Bu metod kenglikni qaytarish uchun ishlatilganda, BIRINCHI mos elementning kengligini qaytaradi.
Bu metod kenglikni o‘rnatish uchun ishlatilganda, BARCHA mos elementlarning kengligini o‘rnatadi.
Quyidagi rasmda ko‘rsatilganidek, bu metodda padding, border va margin hisobga olinmaydi.
Tegishli metodlar:
- height() - Elementning balandligini o‘rnatadi yoki qaytaradi
- innerWidth() - Elementning kengligini qaytaradi (padding hisobga olinadi)
- innerHeight() - Elementning balandligini qaytaradi (padding hisobga olinadi)
- outerWidth() - Elementning kengligini qaytaradi (padding va border hisobga olinadi).
- outerHeight() - Elementning balandligini qaytaradi (padding va border hisobga olinadi).
Sintaksis
Kenglikni qaytarish:
$(selector).width()
Kenglikni o‘rnatish:
$(selector).width(value)
Funksiya yordamida kenglikni o‘rnatish:
$(selector).width(function(index,currentwidth))
| Parametr | Tavsif |
|---|---|
| value | Kenglikni o‘rnatish uchun majburiy. Kenglikni px, em, pt va hokazo birliklarda belgilaydi. Standart o‘lchov birligi: px |
| function(index,currentwidth) | Ixtiyoriy. Tanlangan elementlarning yangi kengligini qaytaradigan funksiyani belgilaydi
|
O‘zingiz sinab ko‘ring — misollar
Elementning kengligini o‘rnatish
Turli o‘lchov birliklari yordamida elementning kengligini qanday o‘rnatish mumkin.
Funksiya yordamida kenglikni kamaytirish
Elementning kengligini kamaytirish uchun funksiyadan qanday foydalanish mumkin.
Hujjat (document) va oyna (window) kengligini qaytarish
Hujjat (document) va oyna (window) elementlarining joriy kengligini qanday qaytarish mumkin.
Tegishli metodlar yordamida o‘lchamlarni ko‘rsatish
width(), height(), innerHeight(), innerWidth(), outerWidth() va outerHeight() metodlaridan qanday foydalanish mumkin.
width() yordamida moslashuvchan dizayn (responsive design)
Kichikroq ekranlarda sahifaning fon rangini qanday o‘zgartirish mumkin.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!