andrewjbateman / javascript-mousemove-shadow

:clipboard: Javascript30 tutorial 16 from Wes Bos. Javascript code to move shadown around text when mouse is moved.

⚡ Javascript Mousemove Shadow

Wes Bos Youtube Tutorial: CSS Text Shadow on Mouse Move Effect - #JavaScript30 16/30.

• Note: to open web links in a new window use: ctrl+click on link

📄 Table of contents

• General info
• Screenshots
• Technologies
• Setup
• Features
• Status
• Inspiration
• Contact

📚 General info

• Tutorial Code using text-shadow property to move shadow around text when mouse is moved.

📷 Screenshots

.

📶 Technologies

• Javascript ECMA-262 ECMAScript 2020

💾 Setup

• Open index.html in browser. If any code is changed the browser needs to be refreshed.

💻 Code Examples

• position of x and y coordinates includes offset from left and top.

  if (this !== e.target) {
    x = x + e.target.offsetLeft;
    y = y + e.target.offsetTop;
  }

🆒 Features

• Can change colours and distance of shadows from header.

📋 Status & To-Do List

• Status: Working.
• To-Do: try different values in formulae to see effect on shadow, add other text properties.

👏 Inspiration

• Wes Bos Youtube Tutorial: CSS Text Shadow on Mouse Move Effect - #JavaScript30 16/30.

📁 License

• N/A

✉️ Contact

• Repo created by ABateman, email: [email protected]