Hello
I have been trying for a long time to fix the problem with zooming along with dragging on mobile.
I have this code that zoom and drag work well on my PC, but only drag works on my mobile and when I try to zoom it always reacts to the panorama.
<krpano>
<preview type="grid(cube,64,64,512,0xCCCCCC,0xF6F6F6,0x999999);"/>
<!-- hidden image layer -->
<layer name="image" url="" scale="0.2" align="center" edge="center" visible="false"
onover="set(iszoom, true); set(startzoom, true); copy(copy_mousefovchange, control.mousefovchange); copy(copy_touchzoom, control.touchzoom); set(control.mousefovchange, 0); set(control.touchzoom, false);"
onout="set(iszoom, false); copy(control.mousefovchange, copy_mousefovchange); copy(control.touchzoom, copy_touchzoom);"
ondown.touch="onover();" onup.touch="onout();"
ondown="start_dragging();" onup="stop_dragging();">
<!-- Close button inside the image layer -->
<layer name="close_button" type="container" url="images/x.png" align="righttop" edge="righttop" x="10" y="10" scale="5" alpha="1" visible="true"
onover="set(layer[close_button].url, 'images/xr.png');"
onout="set(layer[close_button].url, 'images/x.png');"
onclick="set(layer[image].visible, false);"
/>
</layer>
<!-- mouse wheel event for zooming -->
<events name="image_zoom_events" onmousewheel="image_onmousewheel();" ontouchmove="image_ontouchmove();"/>
<!-- action for zooming either via the mouse wheel or via touch gestures -->
<action name="image_onmousewheel">
if(layer[image].visible, if(iszoom,
if(wheeldelta_touchscale GT 0,
<!-- touch zoom -->
if(startzoom, set(startzoom, false); copy(start_wheeldelta_touchscale, wheeldelta_touchscale); copy(start_imagescale, layer[image].scale); );
div(tmp, wheeldelta_touchscale, start_wheeldelta_touchscale);
mul(layer[image].scale, start_imagescale, tmp);
,
<!-- mouse wheel zoom -->
mul(sit, get(wheeldelta), 0.05);
mul(sit, layer[image].scale);
add(layer[image].scale, sit);
);
););
</action>
<!-- action for touch gestures zooming -->
<action name="image_ontouchmove">
if(layer[image].visible, if(iszoom,
if(touchscale GT 0,
if(startzoom, set(startzoom, false); copy(start_touchscale, touchscale); copy(start_imagescale, layer[image].scale); );
div(tmp, touchscale, start_touchscale);
mul(layer[image].scale, start_imagescale, tmp);
);
););
</action>
<!-- the action for dragging the image -->
<action name="start_dragging">
set(pressed, true);
asyncloop(pressed,
layer[image].x += mouse.dx;
layer[image].y += mouse.dy;
);
</action>
<action name="stop_dragging">
set(pressed, false);
</action>
<!-- hotspot that shows the first image on click -->
<hotspot name="DJI_0480" url="thumb/DJI_0480.jpg" ath="0" atv="0" align="righttop" edge="righttop" onclick="set(layer[image].url, 'camera/DJI_0480.jpg'); set(layer[image].visible, true);"/>
<!-- hotspot that shows the second image on click -->
<hotspot name="DJI_0481" url="thumb/DJI_0614.jpg" ath="0" atv="180" align="leftbottom" edge="leftbottom" onclick="set(layer[image].url, 'camera/DJI_0614.jpg'); set(layer[image].visible, true);"/>
</krpano>
thanks in advance for the advice