• Registered: 2013-03-24
  • Posts: 11

Topic: Change Hotspot Size?

Is it possible to change the size of the hotspot over the main image and the navigation arrows. Currently it is too easy to click the main image hotspot when attempting to navigate, specifically on mobile devices due to size.

Thanks

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Change Hotspot Size?

It is not possible to change the size of the hit areas over the main image but you can turn off the default 'navigate-on-image-click' functionality by setting imageClickMode="NONE" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section). In Large Screen Mode, users will then have to click directly on the navigation buttons to navigate between images.
In Small Screen Mode, a tap on the main image in an area other than on a navigation button will toggle the overlay on and off (or will do nothing if the Info Button is displayed on the Button Bar).

  • Registered: 2013-03-24
  • Posts: 11

Re: Change Hotspot Size?

Thank you for your response.  Image click is my primary mode of navigation so I cannot remove that. http://chesterfieldsbronzes.com/mike-fi … culptures/

Is there not some clever workaround?  It is simply too easy to click the image when a user is attempting to click the navigation arrows at the left and right on a small device. 

Your support has been awesome btw.

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Change Hotspot Size?

Is there not some clever workaround?

It might be possible to change the size of the hit areas using CSS but it I expect it would not be as easy as it might seem at first glance. I have tried to reduce the size of the hit areas by modifying the height and width of the .jb-navigation .jbn-nav-touch-area contatiners and then applying suitable margin values to compensate for the new dimensions but this has the unwanted knock-on effect of shifting the navigation arrows from their correct positions.
Also, Juicebox takes into consideration other factors such as the position of the caption area (whether or not it is displayed on the image overlay) and whether or not there are links in the image titles or captions (which requires that the caption area is stacked on top of the hit areas, effectively reducing their size).
Juicebox was not designed to allow the hit areas to be resized or moved and there seems to be no quick and easy solution to do so manually.

If you were to set imageClickMode="NONE", you could perhaps set showNavButtons="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Button Bar' section) to add 'previous' and 'next' navigation buttons to the Button Bar.
This gives users a further method to navigate between images (and the function of the left and right arrows should be fairly self-explanatory).