Offset image to focus one area

[squareclouds]

hello and thanks for the great library! i have added a scroll event for my project and it works great. i was wondering, do you have a quick trick for offsetting the image so when cropped the canvas focuses a specific area? either in percent like 75% 100% or just "center right" or something like that.

any help is appreciated!

[squareclouds]

i got it working. i changed this in my shader fragment

i define a focus point 'focusx' in the shader

uniform float time;
uniform float pixelRatio;
uniform float focusx;
...

i changed

vec2 vUv = (uv - vec2(0.5))*resolution.zw + vec2(0.5);

to

vec2 vUv = (uv - vec2(focusx))*resolution.zw + vec2(focusx);

then i define and pass that uniform from js

//look for the relevant areas in js code where similar definitions are done and add this to each part
this.focusx = this.container.getAttribute('data-focusx');
...
this.uFocusx = new Uniform('focusx', '1f', this.program, this.gl);
...
this.uFocusx.set(this.focusx);

now if i set 'data-focusx' in my html element like data-focusx="0.75" then the image is rendered focusing the area at 75% of the width when the image is getting cropped