Forum Discussion
Demo: Detective Security Leaks within 360 panorama
I used to love using 2D office layouts for creating learning activities for different course topics. Learners can explore the virtual office and learn to deal with whatever might actually happened i...
To enlarge:
gsap.to(panoramaImg, duration:1, scale:2); var panoramaImg = document.querySelectorAll("canvas");
--> Any name can be used to refer to the variable.
--> Since the image is a canvas, the query selector must be All (you can see this by analyzing the module and noticing that the image is a "canvas").
- Duration is adjustable (1 works well for the zooming effect).
--> You can also vary the scale (2 is x2, don't zoom in too much if the quality is low).
For enlarge:
gsap.to(panoramaImg, duration:1, scale:1); var panoramaImg = document.querySelectorAll("canvas");
Similar to previously, but with a scale of 1 (the entire image).
Additionally, remember to run the javascript with a trigger (in this case, by clicking on icons 1 and 2 to zoom in and out, respectively).
Do not neglect to replace icons 1 and 2 are normal, conceal them. When icons 1 and 2 are normal, reveal them.
Don't forget to click on icon 1 to conceal it, and click on icon 2 to hide it.
You can't do it by state (unless you already know the answer; in that case, please share it with us!)
