elevatezoom | elevateZoom - A jQuery image zoom plugin | Plugin library

Your problem is probably that you're targetting an unique id that's not actually unique, so I'd remove that id and target the [data-zoom-image] instead.

You can achieve that by using the find_elements_by_css_selector() function.

It looks like have 4 potential problems working against you on this.

1. The script /s/jqueryelevateZoom-308min.js isn't loading due to Squarespace responding with the Content-Disposition: Attachement header. I suppose that is just how Squarespace is setup for assets in the /s/ folder. That didn't used to be the case, but it appears to be now.

2. The on ready JQuery event may not fire at the proper time.

3. The source image that will be zoomed may not be large enough, due to Squarespace's JavaScript-based dynamic image loader.

4. You should target the img element inside that image block div, not just the image block div itself.

To remedy all of those issues, do the following:

In the header code injection, replace the line with the actual contents of the jqueryelevateZoom-308min.js file, pasted between an opening and closing

Then, add the following script below that.

The problem is with how are you trying to handle an onclick event on a button, without taking into consideration that this button is a part of a form

In simple words, whenever a button is pressed inside of a form it tries to submit that form via html post request if not declared otherwise.

So if you want this to work you can do something like this.

Change this

I fixed again code ;)

This solution is similar to what you want:

It's simple, just change