The method of realizing simple mouse following effect with JS

Source: Internet
Author: User

Mouse following, as the name suggests, is when the mouse moves, there is an animation followed by the mouse to move together.


Point one:

1 var oevent = evt | | window.event;

This is to be compatible with IE and FF written, in IE under the window.event to represent the event object, and FF, is to the event function pass a parameter, this parameter represents the event object.

Point two:

1 Document.onmousemove = function (evt)

Mouse Follow is what happens when the mouse moves.

Point three:

1 Document.documentElement.scrollTop | | Document.body.scrollTop;

This is to be compatible with chrome and other browsers, scroll the distance from the top, chrome with the back, and other browsers with the front one.

Point four:

1 otop.style.top=oevent.clienty+scrolltop+10+ "px";

Assigns the current position of the mouse to the position value of the element when the mouse is moved.

Oevent.clienty is the mouse's current y-coordinate position, add scrolltop distance is to scroll to not the first screen, the mouse follow the effect is still unchanged and write.

The code is as follows:

/tbody>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 The
Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.