Conditional Hotspot image URL for Mobile devices

robotpano · November 12, 2014 at 8:34 AM

I wish to use a smaller hotspot image on mobile devices. I have tried the following, but it does not work:

Code

<hotspot name="mySpot"  url="images/large.png"  devices="!mobile"  />

Code

<hotspot name="mySpot"  url="images/small.png"  devices="mobile"  />

Is there a way to do this? Perhaps I am meant to use hotspot[name].loadStyle()

klaus.krpano · November 12, 2014 at 9:47 AM

Hi,

the code itself is okay and should work (maybe you need to clear the browser cache).

With version 1.18 you could also do:

Code

<hotspot name="mySpot"
         url.no-mobile="images/large.png" 
         url.mobile="images/small.png" 
         />

Best regards,
Klaus

robotpano · November 13, 2014 at 12:46 AM

Thanks Klaus, "url.no-mobile" worked beautifully!

I was able to combine it with scale.no-mobile="2", so my small mobile hotspot images display correctly.

Thank you for the elegant design!

ibrews · October 11, 2016 at 7:29 PM

Anyone know how to do this but with stereo? I have a hotspot that I want to behave one way when in VR mode, and a different way when not in VR mode.

Tried:

url.no-stereo="images/large.png"
url.stereo="images/small.png"

url.no-webvr="images/large.png"
url.webvr="images/small.png"

as examples and they didn't seem to work.

Participate now!