javascript - Is there a faster method in vue.js to scroll the current interface to a certain part?
为情所困
为情所困 2017-05-18 10:45:35
0
8
619

For example, commonly used to return to the top, ordinary HTML pages can set the href attribute of the a tag to a certain id, and then scroll the scroll bar to that part when clicked (of course, you can also directly set the scroll bar distance. high).

My current requirement is to click different buttons in the same vue component to scroll the scroll bar to the corresponding part (the scrolling effect is optional). Directly using the above mentioned method will trigger a page jump, but if you directly set the height of the scroll bar, you have to obtain the positions one by one, which is not as simple as the former.

Asking for advice, do you have a better idea for realizing this requirement?

为情所困
为情所困

reply all(8)
phpcn_u1582

Element.scrollIntoView()

This is a native API of JS. After calling, the browser will scroll to the position of the target element.

https://developer.mozilla.org...

洪涛

If you can’t use anchor points, you can only get the scroll bar position of each part.

曾经蜡笔没有小新

Then you can only use js, as shown below, get the distance between the target element and the top of the page in the event, and then control the scroll axis:

$(window).scrollTop( $("#caaa").offset().top )
阿神

From a rough perspective, the anchor point method is definitely violent.

曾经蜡笔没有小新

Find a native js plug-in and import it

阿神

Same question! I don’t know either

给我你的怀抱

https://huahua0406.github.io/...

There is a corresponding left and right scroll below. Does it meet your requirements?

大家讲道理

vue-router2

router has the function of simulating anchor points

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template