You could overlay your picture with a grid of hotspots (or, better yet, transparent objects) that on Rollover show zoomed-in portions of the picture. The zoomed-in images could be placed on layers or added to the Hover states of the transparent objects.
I used a web object to show a web page. The files for which I have attached.
To use you swap add your image to the demo/img folder and reference it in the index.html
The size of the image determines how much magnification is possible, editing the index.js file can determine the mag size and also if it is rectangle of circular.
You can also set the background colour to match or in this case it is transparent, by editing the index.css file.
I have used quite a few of the magnify tools and at the moment this is my favourite.
4 Replies
You could overlay your picture with a grid of hotspots (or, better yet, transparent objects) that on Rollover show zoomed-in portions of the picture. The zoomed-in images could be placed on layers or added to the Hover states of the transparent objects.
You can also use a web object https://360.articulate.com/review/content/c981e3db-438b-4b77-b831-f8762f24d0ff/review
Phil, that looks great! Can you please elaborate on how you did that?
I used a web object to show a web page. The files for which I have attached.
To use you swap add your image to the demo/img folder and reference it in the index.html
The size of the image determines how much magnification is possible, editing the index.js file can determine the mag size and also if it is rectangle of circular.
You can also set the background colour to match or in this case it is transparent, by editing the index.css file.
I have used quite a few of the magnify tools and at the moment this is my favourite.
This discussion is closed. You can start a new discussion or contact Articulate Support.