<script language="javascript">
function clickStat(evt) {
//下面的try-catch语句兼容不同浏览器下创建element的方法；
try{
var image = document.createElement_x("<img></img>");
}catch(err){
var image = document.createElement_x('img');
}
//这里不用document.body.scrollLeft方法来获得滚动条的值，因为在w3c标准的网页中返回值始终为0；
var tempX = evt.clientX + document.documentElement.scrollLeft;
var tempY = evt.clientY + document.documentElement.scrollTop;
image.src = "/click_stats.php?width=" + screen.width + "&x=" + tempX + "&y=" + tempY;
image.height = 0;
image.width = 0;
//下面的try-catch语句屏蔽Firefox下的报错信息；
try{
document.body.insertBefore(image);
}catch(err){}
return true;
}
</script>
<wbr><wbr></wbr></wbr>
经过本人在IE以及MAXTHON下的测试，document.documentElement.scrollLeft和document.documentElement.scrollTop返回值都是0，不知道原著是否有错误。全部改成document.body.scrollLeft和document.body.scrollTop就可以了！
<wbr><wbr></wbr></wbr>
然后在<body>标签中加入onmousedown=”clickStat(event);”方法。这样做也是为了浏览器兼容（tmd，这些烂标准啥时候能统一）。
在服务端用click_stats.php来接收传递过来的参数，并记录到指定的文件中。如果对多个页面进行统计，还可以在参数中增加页面信息，在服务器端根据页面参数把数据保存到不同的文件中。
接收到的参数包括客户端的屏幕分辨率和点击时的具体坐标，可以根据自己的需要对采集到的数据进行分析。例如，可以确定页面上每个按钮或链接的具体坐标范围，来统计每个按钮或链接的点击次数以及占所有点击次数的百分比。
为了更加直观，我把完整的页面截了一个图作为背景，然后用gd在图上把采集到的数据画成一个个的点，这样就可以清晰的看到页面的点击情况，被点击次数多的按钮或链接，点分布的非常密集，反之就非常稀疏，或者根本没有。直观的反映了受欢迎的程度。
还有需要注意的是，在进行分析的时候一定要考虑到分辨率的问题，例如如果用来画点的背景截图是1024的，而客户端的分辨率是1280的，在画这个坐标点的时候就要在横坐标上减去128。
| if( $_GET[width] > "1024") $_GET[x] =<wbr><wbr></wbr> $_GET[x] - ( ( $_GET[width] - 1024 ) % 2 );<br> elseif( $_GET[width] < "1024") $_GET[x] =<wbr><wbr></wbr> $_GET[x] + ( ( 1024 - $_GET[width] ) % 2 );</wbr></wbr> |
看到统计结果，你就会发现很多地方和你想象的很不一样。没有为什么，真实的数据才能真实的反映用户的行为，而我们作为网站的设计和实现者，完全不能代表普通用户，往往一厢情愿的得到错误的结论。
|
$im<wbr><wbr></wbr> =<wbr><wbr></wbr> imagecreate<wbr><wbr></wbr> ($max_x,$max_y);<wbr><wbr></wbr><br> $background_color<wbr><wbr></wbr> =<wbr><wbr></wbr> ImageColorAllocate($im,<wbr><wbr></wbr> 0,255,0);<wbr><wbr></wbr> //<wbr><wbr></wbr> 指派一个绿色<wbr><wbr></wbr><br> imagecolortransparent($im,$background_color);<wbr><wbr></wbr> //<wbr><wbr></wbr> 设置为透明色，若注释掉该行则输出绿色的图<br> $tc<wbr><wbr></wbr> = imagecolorallocate ($im, 0, 0, 0);</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>
for($i=0;$i<count($file);$i++)
|
|
<?
<div align="center"><iframe src="<?=$siteurl?>" width="100%" height="<?=$max_y?>" frameborder="0" marginheight="0"></iframe></div> |
