Vierittämällä käyttäjät voivat tarkastella verkkosivuja/pitkiä asiakirjoja vasemmalle ja oikealle tai ylös ja alas. Se voidaan suorittaa lisäämällä vaaka- ja pystysuorat vierityspalkit sisällöstä riippuen. Vierityspalkin mitat, kuten korkeus ja leveys, asetetaan oletusarvoisesti. Näitä voidaan kuitenkin mukauttaa niihin liittyvien JavaScript-menetelmien avulla. Kun ne voidaan lisätä tai asettaa dokumenttiin, käyttäjä voi tunnistaa ne helposti sisäänrakennetun ' scrollTop() ', ja ' scrollLeft() ”menetelmiä.
Tämä viesti selittää jQueryn 'scrollLeft()' -menetelmän tarkoituksen ja toiminnallisuuden.
Mikä on 'scrollLeft()' -menetelmä jQueryssa?
' scrollLeft() ” -menetelmä on erityisesti suunniteltu vaakasuuntaiselle vierityspalkille sen sijainnin määrittämiseksi ja hakemiseksi pikseleinä. Se laskee valitun HTML-elementin vierityspalkin sijainnin. Sitä käytetään enimmäkseen div-, säiliö- ja osioelementteihin.
Syntaksi (Aseta vaakasuuntainen vierityspalkin sijainti)
$ ( valitsin ) .scrollLeft ( asema )
Yllä oleva syntaksi ottaa kokonaisluvun arvokseen ' asema '-argumentti asettaa kohdistetun valitsimen vaakasuuntaisen vierityspalkin sijainnin.
Syntaksi (Hae vaakasuuntainen vierityspalkin sijainti)
$ ( valitsin ) .scrollLeft ( )
Tämä syntaksi palauttaa valitsimen 'sijainti'-argumentin arvon pikseleinä.
Käytetään määriteltyä menetelmää käytännössä.
HTML-koodi
Katso ensin ilmoitettu HTML-koodi:
< osio tyyli = 'korkeus: 150 pikseliä; leveys: 200 kuvapistettä ; marginaali: automaattinen; reunus: 2 kuvapistettä tasainen musta; ylivuoto: automaattinen;välilyönti: nowrap;' >
< h2 > Tervetuloa Linuxhintiin ! h2 >
osio >
< -painiketta > Aseta sijainti -painiketta >
Yllä olevilla koodiriveillä:
- '
' -tunniste sisältää osion HTML-dokumentin sisällä, joka on mukautettu 'style'-attribuutin avulla. - Luodussa osiossa ' ” -tunniste määrittää alaotsikon.
- Lopuksi '
' -tunniste lisää painikkeen.
Huomautus: Noudata annettua HTML-koodia kaikissa tämän viestin esimerkeissä.
Esimerkki 1: 'scrollLeft()' -menetelmän käyttäminen vierityspalkin (vaakasuuntaisen) sijainnin asettamiseen
Tässä esimerkissä käytetään 'scrollLeft()' -menetelmää vierityspalkin (vaakasuuntaisen) asettamiseen määritettyyn kohtaan.
jQuery-koodi
Noudata annettua jQuery-koodia:
< käsikirjoitus src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js' > käsikirjoitus >< käsikirjoitus >
$ ( asiakirja ) .valmis ( toiminto ( ) {
$ ( 'painike' ) .klikkaus ( toiminto ( ) {
$ ( 'osasto' ) .scrollLeft ( viisikymmentä ) ;
} ) ;
} ) ;
käsikirjoitus >
Tässä koodinpätkässä:
- Määritä ensin jQuery-kirjaston CDN-polku '