Make an image follow mouse pointer

前端 未结 3 1366
误落风尘
误落风尘 2020-12-05 18:02

I need a rocket to follow the movements of the mouse pointer on my website. This means it should rotate to face the direction of motion, and if possible, accelerate dependin

3条回答
  •  离开以前
    2020-12-05 18:47

    Ok, here's a simple box that follows the cursor:

    
    
    

    Doing the rest is a simple case of remembering the last cursor position and applying a forumula to get the box to move other than exactly where the cursor is. A timeout would also be handy if the box has a limited acceleration and must catch up to the cursor after it stops moving. Replacing the box with an image is simple CSS (which can replace most of the setup code for the box). I think the actual thinking code in the example is about 8 lines.

    Select the right image (use a sprite) to orientate the rocket.

    Yeah, annoying as hell. :-)

提交回复
热议问题