Scroll scroll correlation in JS

Time:2019-10-6

Scroll scroll correlation in JS

Scroll, scroll, generally discusses the relationship between the overall web page and the browser.

I. Elemental correlation

Attribute/Method explain
element.scrollHeight Returns the overall height of the element.
element.scrollWidth Returns the overall width of the element.
element.scrollLeft Returns the distance between the left edge of the element and the view.
element.scrollTop Returns the distance between the edge on the element and the view.

These four attributes are all read-only attributes

Among them, nothing is more than dividing intoWidth heightandLeft upper
Two directions.

1. scroll Height and scroll Width

  • Use scrollHeight and scrollWidth attributes to return the height of the element in px, including padding
  • The values returned by scrollHeight and scrollWidth include the currently invisible parts.
  • ScrollHeight and scrollWidth attributes are read-only attributes

2. scrollLeft and scrollTop

  • Need a listening method
  • There are also browser compatibility issues

II. Window correlation

1. scrollBy () and scrollTo () of windows objects

1.scrollBy(x,y)

The scrollBy (x, y) method scrolls the document displayed in the current window, and X and Y specify the relative amount of scrolling.

ScrollBy (0, 200) ==> increases the position of the Y axis of the scrollbar by 200 on the current basis. For example: the current Y axis position is 0, after execution is 200; the current is 100, after execution is 300.

  • To make this method work, the visible property of the window scrollbar must be set to true!

2.scrollTo(x,y)

scrollTo(xpos,ypos)

  • XPOS is required. The x coordinates of the document to be displayed in the upper left corner of the window document display area.
  • YPOS is required. The y coordinates of the document to be displayed in the upper left corner of the window document display area.

ScrollTo (x, y) method: Scroll the document displayed in the current window so that the points specified by coordinates x and Y in the document are in the display area

Recommended Today

Mongoose error: getaddrinfo ENOTFOUND localhost localhost:27017

{ Error: getaddrinfo ENOTFOUND localhost localhost:27017 at errnoException (dns.js:50:10) at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:92:26) code: ‘ENOTFOUND’, errno: ‘ENOTFOUND’, syscall: ‘getaddrinfo’, hostname: ‘localhost’, host: ‘localhost’, port: 27017 } mongoose.connect(‘mongodb://localhost:27017/db1’,{ poolSize:5, useNewUrlParser: true },err=>{ if(err){ console.error(err) }else { Console.log (‘mongodb successfully connected ‘) } }) Try changing localhost to 127.0.0.1 mongoose.connect(‘mongodb://127.0.0.1:27017/db1’,{ poolSize:5, useNewUrlParser: true },err=>{ if(err){ console.error(err) […]