Visina i širina su najvažnije dimenzije pri dizajniranju izgleda web stranice.
'Visina' označava mjerenje duljine objekta od vrha do dna, dok 'širina' označava koliko je objekt širok od jedne do druge strane. Ovi čimbenici pomažu u prilagođavanju dodjele objekta u prozoru. U JavaScriptu, ' visina ' i ' širina ” svojstva dalje se klasificiraju u dvije kategorije „unutarnja” tj. „unutarnja visina/unutarnja širina” i „vanjska” tj. „vanjska visina/vanjska širina”.
Ovaj tekst razrađuje cilj i rad svojstva Window 'innerHeight' u JavaScriptu.
Što svojstvo Window 'innerHeight' radi u JavaScriptu?
' unutarnja visina ” Svojstvo je povezano s objektom “window” koji dohvaća visinu prozora preglednika isključujući lokacijsku traku, alatnu traku, traku izbornika i druge. Također, uključuje visinu vodoravne trake za pomicanje ako je uključena. Vraćena vrijednost ovog svojstva preuzeta je iz prozora 'pogled izgleda', tj. područja koje prikazuje sadržaj web stranice.
Osnovna sintaksa
window.innerHeight ILI innerHeight
Prema gornjoj sintaksi, ' unutarnja visina ” svojstvo se lako može primijeniti izravno ili korištenjem objekta “window”.
Implementirajmo gore definirano svojstvo praktično uz pomoć njegove osnovne sintakse.
Primjer 1: Primjena svojstva prozora “innerHeight” za vraćanje visine okvira za prikaz prozora preglednika
Ovaj primjer koristi svojstvo 'innerHeight' s objektom 'window' za dohvaćanje visine okvira za prikaz prozora preglednika.
HTML kôd
Prvo, pogledajte dolje naveden kod:
< h2 > Svojstvo unutarnje visine prozora h2 >< dugme na klik = 'jsFunc()' > Dobiti visinu dugme >
< str iskaznica = 'za' > str >
U gornjim linijama koda:
- ' ” definira podnaslov razine 2.
- '
” oznaka predstavlja gumb koji ima događaj „onclick” za pozivanje funkcije „jsFunc()” kada se događaj pokrene. - ' ” dodaje prazan odlomak s dodijeljenim ID-om “para” za prikaz vraćene vrijednosti primijenjenog svojstva “innerHeight”.
JavaScript kod
Sada nastavite s dolje navedenim kodom:
< skripta >funkcija jsFunc ( ) {
neka h = window.innerHeight;
document.getElementById ( 'za' ) .unutarnjiHTML = 'Unutarnja visina prozora: ' + h;
}
skripta >
U gornjim redcima koda:
- Prvo, definirajte funkciju pod nazivom ' jsFunc() ”.
- U svojoj definiciji, varijabla 'h' primjenjuje ' unutarnja visina ” svojstvo koristeći objekt “window”.
- Nakon toga primijenite ' getElementById() ' za dobivanje dodanog praznog odlomka pomoću njegovog ID-a 'para' i prikaz unutarnje visine trenutnog prozora preglednika u njemu.
Izlaz
Kao što je prikazano u gornjem izlazu, trenutni prozor preglednika prikazuje visinu okvira za prikaz (unutarnju visinu), tj. ' 599 px ” nakon klika na gumb.
Primjer 2: Primjena svojstava kombiniranog prozora “innerHeight” i “innerWidth”
Svojstvo 'unutarnja visina' može se implementirati zajedno s drugim svojstvima dimenzija kao što su 'unutarnja širina', 'vanjska širina', 'vanjska visina' itd. U ovom scenariju koristi se uz ' unutarnjaŠirina ” vlasništvo.
HTML kôd
Pogledajmo pregled modificiranog HTML koda:
< h2 > Svojstva unutarnje visine i unutarnje širine prozora h2 >< dugme na klik = 'jsFunc()' > Dobijte visinu i širinu dugme >
< str iskaznica = 'za' > str >
Ovdje se sadržaj elemenata “