The 'window.open()' JavaScript-menetelmän avulla kehittäjät voivat linkittää verkkosivunsa toiseen ikkunaan. Tämä ikkuna avautuu, kun käyttäjä suorittaa tietyn toiminnon.
Lyhyesti sanottuna tärkeimmät toiminnot 'window.open()' tapa on avata uusi ikkuna pääsivun päälle häiritsemättä pääsivun käyttöliittymää. Joissakin tilanteissa uusi ikkuna avautuu onnistuneesti, mutta vierityspalkkia ei näy ollenkaan, mikä antaa käyttäjille huonon vaikutelman.
Tämä pikaopas selventää prosessia pystysuoran vierityspalkin luomiseksi JavaScriptin window.open()-menetelmällä.
Kuinka luoda pystysuuntaisia vierityspalkkeja 'window.open()':n avulla JavaScriptissä?
The 'window.open()' menetelmä lisää oletusarvoisesti pystysuoran vierityspalkin uuden verkkosivun sisällön pituuden ja avatun ikkunan koon mukaan. Jos verkkosivun sisältö on suurempi kuin ikkunan koko, vierityspalkki lisätään oletusarvoisesti ilman CSS-ominaisuuksia. Jos kehittäjä kuitenkin haluaa lisätä mukautetun vierityspalkin, voit seurata alla olevissa esimerkeissä selitettyjä menetelmiä.
Syntaksi
Syntaksi kohteelle 'window.open()' menetelmä on kerrottu alla:
ikkuna. avata ( polku , määränpäähän , winFeat )Tässä, 'polku' on sen verkkosivun polku, joka avataan uuteen ikkunaan. The 'kohde' on uuden ikkunan sijainti, se voidaan asettaa 'tyhjä' , 'vanhempi' , 'itse' tai 'ylhäältä'. Kolmas parametri on 'winFeat' eli ikkunaominaisuudet, se tarjoaa erilaisia arvoja, jotka voidaan asettaa ikkunan mukauttamistarpeen mukaan.
Katsotaanpa joitain esimerkkejä pystysuoran vierityspalkin luomiseksi äskettäin avautuvaan ikkunaan käyttämällä 'window.open()' menetelmä.
Esimerkki: 'Scrollbars'-ikkunaominaisuuden käyttö 'window.open()'-menetelmän kanssa
Tässä tapauksessa 'window.open()' menetelmää käytetään yhdessä 'vierityspalkit' Ikkunan ominaisuudet pystysuoran vierityspalkin asettaminen äskettäin avatulle ikkunalle alla olevan kuvan mukaisesti:
< pää >< skriptityyppi = 'teksti/javascript' >
toiminto setScroll ( ) {
oli newWin = ikkuna. avata ( 'https://linuxhint.com' , 'huippu' , 'width=500,height=500,scrollbars=yes' ) ;
}
käsikirjoitus >
pää >
< kehon >
< s > Paina alla olevaa painiketta avataksesi Linuxhint-blogin sisään - näytön ikkuna. s > Napsauta Minä -painiketta >
kehon >
Selitys yllä olevalle koodille:
- Ensinnäkin 'setScroll()' toiminto on määritelty sisällä '
Paina alla olevaa painiketta avataksesi Linuxhint-blogin näytön ikkunassa.
Napsauta minua
Kuvaus yllä olevasta koodista:
- Luo ensin a 'setScroll()' toimintoa, ja sen sisällä hyödynnetään 'window.open()' menetelmä on sama kuin yllä olevassa esimerkissä.
- Lisää myös ylimääräinen ikkunaominaisuus 'muokattava' ja muuttaa arvoa 'vierityspalkit' ominaisuuksia '1' asettaaksesi pystysuoran vierityspalkin.
Avaa nyt sen verkkosivun CSS-tiedosto, jonka linkki on ensimmäinen parametri 'window.open()' menetelmä. Meidän tapauksessamme verkkosivun nimi on 'linuxint' joten avaa sen CSS-tiedosto ja lisää siihen seuraava koodi:
< tyyli >html {
ylivuoto - x : piilotettu ;
ylivuoto - ja : auto ;
}
tyyli >
Yllä olevat CSS-ominaisuudet 'ylivuoto-x' ja 'ylivuoto-y' piilota vaakasuuntainen vierityspalkki ja aseta pystysuora vierityspalkki koko HTML-sivulle ikkunan pituuden mukaan.
Kun olet lisännyt ja kääntänyt yllä olevat koodinpätkät molempiin tiedostoihin, tulos näyttää tältä:
Tulos näyttää, että pystysuora vierityspalkki on lisätty 'window.open()'-menetelmällä avautuvaan ikkunaan.
Johtopäätös
Pystysuuntaisten vierityspalkkien luominen -painikkeella 'window.open()' menetelmä, 'vierityspalkit' ikkunan tarjoama ominaisuus voidaan asettaa päälle 'Joo' tai '1' . Toinen tapa on avata CSS- tai HTML-tiedosto verkkosivulle, jonka linkki välitetään ensimmäisenä parametrina 'window.open()'-metodissa ja käyttää siellä CSS:ää. 'ylivuoto-x' ja 'ylivuoto-y' ominaisuuksia. Tässä blogissa on selitetty tapoja lisätä pystysuora vierityspalkki JavaScriptin window.open()-menetelmällä.