Issue when adding hotspot to a slider (siema slider)

[osinho]

Hi all,

I have a siema (https://github.com/pawelgrzybek/siema) slider running on my page. Adding hotspots to the visible slides is not an issue at all - adding them for slides that are not visible (visible as in not shown in the browser since overflow is set to hidden in the parent DIV - from a css perspective I believe they are set to visible) does not work.

I tried using siemas onChange event which fires every time slides change, but without any luck.

Within the onChange event I added this code:

$("#tattoo-slider-3").hotspot({
                        data: [
                            { "x":10, "y":10, "Title":"Travel Mugs","Message":"<a href='/dinnerware/tattoo-cilla-marea/?_bc_fsnf=1&Product=Mugs' class='button button--primary' style='line-height: 0.5rem;padding: 0.5rem;'>see details</a>" }
                        ],
                        tag: 'img', //optional (default is img)
                        interactivity: "hover", // options : click, none (default is hover),
                        pulse: true // this is a customization I added
                    });

I have a feeling the hotspots are not being set for items which are not visible on screen...

Can you point me into the right direction?

Thanks!
Marc

EDIT: here the link to the plugin in my production environment:
https://www.rosenthalusa-shop.com