Jump to content

mouse hover effects on image map

Recommended Posts

Posted

Site URL: https://gregory-ain.squarespace.com

hi squarespace experts!  

as a non-coder i'm looking for an assist on a page i've created using the york template.  

i've got a responsive image map working very nicely as a code block on the page, but would like to add some hover effects on mouse over and on mouse out (not the technical terms, i know).  ideally the on mouse over would unblur the specific portions of the image that are hot spots.  i do have the unblurred portions of the image saved as separate files.  

this is the code i'm currently using.  although the image map has six different hot spots, i've included just a portion of the code (for one hot spot) to simplify things for anyone that might be able to help.

any advice is greatly appreciated!

<img src="https://static1.squarespace.com/static/5f861b8ef918960d6454dea6/t/5f974d123a11f76bae215959/1603751187099/1_%C2%A9MAP_MoMAnoimage.jpeg" usemap="#image_map">

<map name="image_map">

<a href="https://gregory-ain.squarespace.com/gregory-ain" title="Gregory Ain" style="position: absolute; left: 0.46%; top: 5.08%; width: 22.49%; height: 15.89%; z-index: Gregory Ain;"></a>

  • Replies 1
  • Views 1.3k
  • Created
  • Last Reply

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.