Source code

<krpano version="1.19.12" onstart="showlog(true);" > 
<preview type="grid();" /> 
<layer name="zoom_canvas" 
url="%SWFPATH%/plugins/scrollarea.swf" alturl="%SWFPATH%/plugins/scrollarea.js" 
align="center" width="500" height="PROP" direction="all" 
> 

<layer name="image" url="img/Rychleby.jpg" scale="0.1" align="center" edge="center" 
onover=" 
trace( %0,'(', %1 %2,') name=',name, ' ONOVER: control.mousefovchange=',control.mousefovchange, ' =', , ' tick=', timertick); 
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();" 
/> 
</layer> 
<!-- mouse wheel event for zooming 
--> 
<events name="image_zoom_events" onmousewheel="image_onmousewheel();" keep="true" /> 


<!-- the action for zooming either via the mouse wheel or via touch gestures --> 
<action name="image_onmousewheel"> 
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.01); 
mul(sit,layer[image].scale); 
add(layer[image].scale,sit); 
); 
); 
</action> 

</krpano>

Source code

mwheel=false 

Source code

<action name="calc_mouse_offset"> 
<!-- to stay focused on the zoom in/out place of the image 
%1 output 
%2 [x,y] the x- or y- direction 
--> 
calc(stage_half, stagewidth/2 ); 
if(%2 == 'y', calc(stage_half, stageheight/2 );); 
calc(mouse_im%2, (stage_half - mouse.%2)); 
calc(%1, ((layer[image].scale - 1.0)*mouse_im%2) BOR 0); 
dbg_swp(trace( %0,'(', %1 %2,')=',get(%1), ' mouse_im%2/mouse.%2=',mouse_im%2,'/',mouse.%2, ' IMAGE: ..scale=',layer[image].scale, ' ..stage_half=',stage_half, ' ..pixelwidth*=',layer[image].pixelwidth, ' ..pixel%2*=',layer[image].pixel%2, ' ..o%2=',layer[image].o%2, ' tick=', calc(timertick BOR 0));); 
</action>

Source code

<!--  some code for layer dragging  -->
<action name="image_ondown_dragging">
copy(mstartx, mouse.x); 
copy(mstarty, mouse.y); 
copy(lstartx, x); 
copy(lstarty, y); 
asyncloop(pressed, 
calc(x, lstartx + mouse.x - mstartx); 
calc(y, lstarty + mouse.y - mstarty);
,
callwith(layer[image],onover);
 );

</action>