Drsenje omogoča uporabnikom ogledovanje spletnih strani/dolgih dokumentov levo in desno ali gor in dol. Izvede se lahko z dodajanjem vodoravnih in navpičnih drsnih trakov, odvisno od vsebine. Mere drsnega traku, kot sta višina in širina, so privzeto nastavljene. Vendar jih je mogoče prilagoditi s pomočjo njihovih povezanih metod JavaScript. Ko jih je mogoče dodati ali nastaviti v dokumentu, jih lahko uporabnik preprosto prepozna z uporabo vgrajenega » scrollTop() ', in ' scrollLeft() ” metode.
Ta objava pojasnjuje namen in funkcionalnost metode »scrollLeft()« v jQuery.
Kaj je metoda »scrollLeft()« v jQuery?
' scrollLeft() ” je posebej zasnovana za nastavitev in pridobitev položaja vodoravnega drsnega traku v slikovnih pikah. Izračuna položaj drsnega traku izbranega elementa HTML. Večinoma se uporablja za elemente div, vsebnik in razdelek.
Sintaksa (nastavitev položaja vodoravnega drsnika)
$ ( selektor ) .scrollLeft ( položaj )
Zgornja sintaksa vzame vrednost celega števila kot svoj ' položaj ” za nastavitev položaja vodoravnega drsnega traku ciljnega izbirnika.
Sintaksa (pridobite položaj vodoravnega drsnega traku)
$ ( selektor ) .scrollLeft ( )
Ta sintaksa vrne vrednost argumenta »položaj« izbirnika v slikovnih pikah.
Uporabimo definirano metodo praktično.
HTML koda
Najprej si oglejte navedeno kodo HTML:
< razdelek stil = 'height:150px; width: 200px ;margin:auto;border:2px solid black; overflow: auto;presledek: zdajrap;' >
< h2 > Dobrodošli v Linuxhintu ! h2 >
razdelek >
< gumb > Nastavite položaj gumb >
V zgornjih vrsticah kode:
- '
” vsebuje del znotraj dokumenta HTML, prilagojen s pomočjo atributa “style”. - Znotraj ustvarjenega razdelka je » ” določa podnaslov.
- Nazadnje, '
” doda gumb.
Opomba: Sledite navedeni kodi HTML v vseh primerih te objave.
1. primer: uporaba metode »scrollLeft()« za nastavitev (vodoravnega) položaja drsnega traku
Ta primer uporablja metodo »scrollLeft()« za nastavitev drsnega traku (vodoravno) na določen položaj.
Koda jQuery
Sledite podani kodi jQuery:
< scenarij src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js' > scenarij >< scenarij >
$ ( dokument ) .pripravljen ( funkcijo ( ) {
$ ( 'gumb' ) .kliknite ( funkcijo ( ) {
$ ( 'odsek' ) .scrollLeft ( petdeset ) ;
} ) ;
} ) ;
scenarij >
V tem delčku kode:
- Najprej določite pot CDN knjižnice jQuery v '
»oznaka z uradne spletne strani« https://jquery.com/ « s pomočjo » src ” atribut. - Nato druga oznaka “