Click on different part of single image to fire a jquery event (basically show text on click)

Question

I want to show text on click of different parts of image using jquery. Please see the attached image. If I click on first part of the image I want to show text in the center, same as if I click on second part it should show another text of a pie chart. Also can the clicked portion color be changed. also the code should work in any device and should be responsive. this image would be placed over a background image. So please suggest accordingly

Please suggest what best can be done.

Try using css sprites to render images in sections and then perform action acordingly — Rahul, Nov 29 '16 at 06:09
http://stackoverflow.com/questions/57725/how-can-i-display-just-a-portion-of-an-image-in-html-css — Nobal Mohan, Nov 29 '16 at 06:14

score 0 · Answer 1 · answered Nov 29 '16 at 06:14

0

I think you can use Image Map

Open following links of Image Map example

http://www.w3schools.com/TAGs/tryit.asp?filename=tryhtml_areamap

http://html.com/images/how-to-make-an-image-map/

answered Nov 29 '16 at 06:14

Rajender Kumar

174
7

Click on different part of single image to fire a jquery event (basically show text on click)

1 Answers1