0

所以我想跟踪每张图片的图片（横幅）印象。例如，如果一个图像在页眉中，它应该在页面加载时跟踪展示，但如果图像在页脚中，它应该只在用户向下滚动到页脚时跟踪它。

我可以用 php 做 1x1 像素图像来跟踪它，但我想我也需要 javascript，

总之，我只想在用户看到图像时（而不是在加载页面时）跟踪图像印象。

有任何想法吗 ？

注意：我已经搜索过了，问题只回答了如何跟踪页面加载时的印象，这不是我想要的。

4

4 回答 4

3

当页面加载时，使用 javascript 来：

  • 确定图像相对于整个页面的位置
  • 检测用户浏览器窗口的大小
  • 如果图像在视口中，则对跟踪脚本运行 ajax 调用
  • 添加一个onscroll事件来检测图像是否已移动到视口中...如果是，则运行 ajax 跟踪脚本。

那应该差不多了。只需确保用于调用跟踪脚本的 javascript 函数只能运行一次（将全局has_been_tracked变量设置为 false，并在跟踪函数运行时让脚本将其切换为 true）

于 2012-07-03T04:27:49.337 回答
0

我明白你的问题。然而，这是一个非常复杂的问题！为简化起见，您应该以以下思维方式处理此问题：“标题图像上的展示次数”（在 PHP 中跟踪的纯展示次数）+“向下滚动查看广告的用户数量”（仅使用 javascript 跟踪）。

我对 Ben 投了赞成票，因为他在以下方面 100% 正确：要将滚动广告计算为“被看到”，您必须计算屏幕尺寸 + 滚动值 - 图像位置，以查看广告是否被跟踪。如果你没有在标题中包含“印象”，那你就疯了，因为像我这样的人没有运行任何脚本，也不会注册原始网页浏览或滚动。

最有效的跟踪方式是“印象”和/或“转化”，因为它们不依赖用户操作系统、浏览器和浏览习惯来确定盈利能力。需要基础 PHP 和中级 JS 的共同努力。

于 2012-07-03T04:43:02.867 回答
0

  • 您可以看到演示功能跟踪通话印象

  • 您检测到轴滚动顶部+屏幕窗口高度>位置顶部元素您发送印象的横幅。

<body>
<div style="clear:both; height:1000px;"></div>
<div id="banner" style="clear:both; height:200px; background:#f00;">Test show</div>
<script language="javascript">
var windowPrototype={
    wdHeight:function(){
        var myHeight;
        if( typeof( window.innerWidth ) == 'number' ) {
            //Non-IE
            myHeight = window.innerHeight;
        } else if( document.documentElement && (  document.documentElement.clientHeight ) ) {
            //IE 6+ in 'standards compliant mode'
            myHeight = document.documentElement.clientHeight;
        } else if( document.body && (  document.body.clientHeight ) ) {
            //IE 4 compatible
            myHeight = document.body.clientHeight;
        }
        return myHeight;
    },
    wdWidth:function(){ 
        var myWidth;
        if( typeof( window.innerWidth ) == 'number' ) {
            //Non-IE
            myWidth = window.innerWidth;

        } else if( document.documentElement && ( document.documentElement.clientWidth  ) ) {
            //IE 6+ in 'standards compliant mode'
            myWidth = document.documentElement.clientWidth;

        } else if( document.body && ( document.body.clientWidth  ) ) {
            //IE 4 compatible
            myWidth = document.body.clientWidth;

        }
        return myWidth;
    }
}   
function getScrollTop(){
      var ScrollTop = document.body.scrollTop;
       if (ScrollTop == 0)        
         {
             if (window.pageYOffset)
                 ScrollTop = window.pageYOffset;
             else
                 ScrollTop = (document.body.parentElement) ?     document.body.parentElement.scrollTop : 0;
         }
    return ScrollTop;
}
function getElementTop(Elem) {
    if(document.getElementById) {   
        var elem = document.getElementById(Elem);
    } else if (document.all) {
        var elem = document.all[Elem];
    }
    if(elem!=null){
        yPos = elem.offsetTop;
        tempEl = elem.offsetParent;
        while (tempEl != null) {
            yPos += tempEl.offsetTop;
            tempEl = tempEl.offsetParent;
        }
        return yPos;
    }
    else{
        return 0;
    }
}
function tracking(){                        
    var scrolltop=getScrollTop();
    var advZoneTop=getElementTop('banner');
    if((scrolltop+windowPrototype.wdHeight())>advZoneTop){
            //send code tracking.
        alert('send tracking code');
        if(document.images){
            var img=new Image();
            img.src='http://logging.com/trackingbanner.jpg';
        }
    }else{
        setTimeout('tracking()',100);
    }
}
tracking();
//you can on scroll 
/*
window.onscroll = function () {  
  // called when the window is scrolled.  

        var scrolltop=getScrollTop();
        var advZoneTop=getElementTop('banner');
        if((scrolltop+windowPrototype.wdHeight())>advZoneTop){
                //send code tracking.
            alert('send tracking code');
            if(document.images){
                var img=new Image();
                img.src='http://logging.com/trackingbanner.jpg';
            }
        }
}  */
</script>
</body>
</html>
于 2012-07-03T04:53:29.903 回答
0

http://patik.com/blog/within-viewport-javascript-and-jquery-plugin/

上面的链接是一个脚本，当元素（您的案例中的特定图像）完全在视口内时，它将触发一个事件。

在全视图的页脚图像上，如果您有自己的自定义跟踪计数，您可以选择在 Google Analytics 或 AJAX 中跟踪这些事件以调用 PHP 脚本。

于 2012-07-24T12:27:21.980 回答