1

I am working on a simple (at least I thought so at the time) interactive banner advert in google web designer tool.

I am specifically trying to create an effect of a magnifying glass that the user controls and moves around a 300px x 300px banner advert until they find a picture that is hidden at some coordinate on the advert. Once they find the item, it will then cause the advert to redirect the user to the landing page.

I have seen other similar questions and reveal techniques that uses two canvas elements, however I am not sure how to actually make the reveal area only inside the magnifying glass that moves with the mouse, bearing in mind it is a circle..

The hidden image could just be a 300px x 300px white background with the picture located somewhere. Then there is a second image overlaying this to hide it, but then I need the magnifying glass to reveal the first white image that is behind the second. Or alternatively the white background image to be revealed would be above the image that is mostly visible, then the magnifying glass would change it to full transparency inside the circular magnifying glass area?

Anyone got suggestions?

Thanks

mrpetem
  • 323
  • 1
  • 8

0 Answers0