Building a Custom Impression Tracker

Question

For a web application I am building I need to be able to know when a div comes into the users browser, essentially tracking that an impression occurs.

Im posting this to see if anyone can point me in the right direction to achieve this result. I am unsure how I can track when an item comes into the view of the web browser. Can this be achieved through jQuery? Any pointers would be greatly appreciated.

Answer 1

<script> tag

<script> tags are run when placed in the DOM.

You could add a <script> tag to the <div> you want to place, when its loaded in the DOM, the script can preform a AJAX request to let you know it's been loaded.

<script>track_me("special_div");</script>

<img> pixel

Create a 1px x 1px image on your server, place it somewhere in the div with a img tag like so <img src="/pixel.png?ref=my_div" /> this can then be traced in your server logs. You can change ref to be signify different tracking items.

The request will be made when the image is placed in the dom and visible.

You will have to setup caching specifically for this image so its never cached by the browser.