Here is a very simple way ho to create a heat map with jQuery. The idea is to track the clicks of a user and then display the click pattern with semi-transparent dots on an overlay. You can try out the demo by first clicking around on the page and then clicking “Analyze”. Since the ...

Here is a very simple way ho to create a heat map with jQuery. The idea is to track the clicks of a user and then display the click pattern with semi-transparent dots on an overlay. You can try out the demo by first clicking around on the page and then clicking “Analyze”. Since the dots are semi-transparent, spots that have been clicked on more often, will appear slightly darker. Click on the overlay to make it invisible again and continue with the “recording”.
View demoDownload source
Tagged with: heat map jQuery
Related Articles
While CSS3 allows us to rotate letters, it is quite complicated to arrange each letter along a curved path. Arctext.js is a jQuery...
read more
Today we want to show you how to create a neat thumbnail proximity effect with jQuery. The idea is to scale thumbnails when hoveri...
read more
2011 has been an exciting year for Codrops and we want to thank you for supporting us! We've learned a lot and it's a privilege to...
read more
Today we want to share some experimental 3D image transitions with you that use CSS3 animations and jQuery. We'll be using CSS3 3D...
read more
Very nice, this is a very usefull add to GA for example.
On wich place does a person click on an image link.
Tnx
@Groningen
This already exists in GA ;-)
Well it exist in GA, as al link map, but not the exact place where a person clicks. for example if you have a big header image, you can see on wich place a person clicks.
Can anyone provide an example of how to write the heat map info to disk, so you can capture multiple users data rather than just the single current user session?
Nice plugin – i agree, would be nice to have some solution to write the data into a database. for analyzing later on…is this possible?
Greetings
tympansus is a very interesting blog :)
You have an interesting plug-in here. Thanks for this.
Is there a way to save the clicks so the website owner could see what areas of his site are getting clicked on?
You might have bits that aren’t clickable, but people always click on them, so it’d be great to know what people are doing.
This is really interessting… despite the fact that GA uses an OverlayMap, this solution point the exact click out. It would be interessting to save the data to MySQL… and renerate an own analytics Tool ;-)
Great work !
Congratulations !