HoverMate

• 

  HoverMate Logo

• 

  Word Definition Example

• 

  Website Preview Example

Inspiration

The idea for HoverMate came from Wikipedia’s feature that shows additional details when you hover over a link. I wanted to create an extension that could bring that same seamless functionality to any website, allowing users to gain quick insights and definitions as they browse.

What it does

It lets users get word definitions from words they have highlighted and be able to preview links before they click them.

How I built it

I build the extension using Javascript and leveraging the chrome extension api

Challenges I ran into

Upgrading the project from manifest v2 to manifest v3 which was unfamiliar to me

What I have learned

I deepened my understanding of Chrome extension development, including managing iframes, creating draggable and resizable elements, and implementing hover-based interactions. I also learned about handling cross-origin restrictions and designing user-friendly, interactive UI elements within the constraints of a Chrome extension.

What's next for HoverMate

Adding more features such as Google Translate

Built With

• javascript