DelphiFAQ Home Search:
General :: Web publishing :: JavaScript :: Events
Questions, answers and code examples dealing with javascript event handlers.

Articles:

This list is sorted by recent document popularity (not total page views).
New documents will first appear at the bottom.

Featured Article

Tracking clicks on banners and Google text ads

Question:

I want to track clicks on ads displayed on my site but the ads are in an IFRAME with the source hosted by the advertising company. How can I detect a click on a link in an IFRAME if the IFRAME source comes from a foreign domain?

Answer:

It is supposed to be not possible (in a clean way) but here is a workaround:

Track the mouse cursor on the screen. When the window loses focus, check to see if the mouse's last position was near the IFRAME. It is not 100% accurate, but will detect most banner clicks.

Notes:
  1. The blue area around the IFRAME is the detection area.
  2. Clicking this area will sometimes count as a banner click, but since nothing is there, not many people will click it. IE bug?
  3. Holding the mouse over the banner and alt-tabbing will also count as a click. This isn't very likely either.
  4. Right-clicking the banner counts as a click, even if the link isn't followed.
  5. If the user moves his mouse too fast, the cursor will not enter the detection area (and not be detected).
  6. The form output is optional. It is only there so you can see what is goin on.
  7. Replace the ####### with your iframe url.
  8. IFRAME only works in IE, so there is no netscape version of the script.

<html><head></head><body>
 <br><br><br>
 <table cellspacing=0 cellpadding=0><tr><td width=200></td><td 
 bgcolor=blue>
 <iframe src="#######" width=300 height=50 scrolling=no vspace=15 
 hspace=15></iframe>
 </td></tr></table>
 <center>
 <br><br><br><br><br><br><br><br><br><br>
 
 <form name=f>
 X<input name=x size=5><br>
 Y<input name=y size=5><br>
 In Iframe?<input name=i size=5><br>
 Clicked Banner?<input name=cl size=5><br>
 </form>
 </center>
 
 <script>
 //remote iframe click detector
 //by Marfan (onlywhenitscold@doglover.com)
 //1-30-04
 
 d=document;
 
 function Point(x,y){
   this.x=x;
   this.y=y;
 }
 
 function Rect(x1,y1,x2,y2){
   this.x1 = x1;
   this.y1 = y1;
   this.x2 = x2;
   this.y2 = y2;
   this.Contains=Contains;
   function Contains(p){	
     with(this) return (x1<p.x && x2>p.x && y1<p.y && y2>p.y);
   }
 }
 
 mouse = new Point(0,0);
 iframe = new Rect (212,75,541,153);
 
 function getMouseXY() {
   mouse.x = event.clientX + d.body.scrollLeft;
   mouse.y = event.clientY + d.body.scrollTop;
 
   //update form
   d.f.x.value = mouse.x;
   d.f.y.value = mouse.y;
   d.f.i.value = (iframe.Contains(mouse))?"Yes":"No";
 }
 
 function checkClick() {
   d.f.cl.value = (iframe.Contains(mouse))?"Yes":"No";
 }
 
 function checkClick() {
   d.f.cl.value = (iframe.Contains(mouse))?"Yes":"No";
 }
 function clearClick() {
   d.f.cl.value = "No";
 }
 
 d.onmousemove = getMouseXY;
 window.onblur = checkClick;
 d.onclick = clearClick;
 </script>
 
 </body></html>

Generated 0:02:44 on Nov 20, 2017