在jquery中的滚动事件中调用Google Analytics

时间:2016-06-28 10:36:03

标签: javascript jquery google-analytics

我在google analytics的母版页中有以下代码。

<script type="text/javascript">
(function (i, s, o, g, r, a, m) {
    i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
        (i[r].q = i[r].q || []).push(arguments)
    }, i[r].l = 1 * new Date(); a = s.createElement(o),
    m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

ga('create', '@System.Configuration.ConfigurationManager.AppSettings["GoogleAnalyticsID"]', 'auto');
ga('send', 'pageview');
</script>

我需要在js中调用Google分析滚动事件如何调用Google分析功能进行滚动事件?你能帮我解决这个问题吗? ?

1 个答案:

答案 0 :(得分:0)

在我公司工作的人开发了一个与Google Analytics Classic一起使用的库,我使用了Track Scroll插件并将其调整为触发Universal Google Analytics,这里是代码:(如果您有任何疑问,只需问我)

&#13;
&#13;
/**
 * GAS - Google Analytics on Steroids
 *
 * Max-Scroll Tracking Plugin
 *
 * Copyright 2011, Cardinal Path and Direct Performance
 * Licensed under the GPLv3 license.
 *
 * @author Eduardo Cereto <eduardocereto@gmail.com>
 */

var _maxScrollOpts;

/**
 * Get current browser viewpane heigtht
 *
 * @return {number} height.
 */
function _get_window_height() {
    return window.innerHeight || documentElement.clientHeight ||
        document.body.clientHeight || 0;
}

/**
 * Get current absolute window scroll position
 *
 * @return {number} YScroll.
 */
function _get_window_Yscroll() {
    return window.pageYOffset || document.body.scrollTop ||
        documentElement.scrollTop || 0;
}

/**
 * Get current absolute document height
 *
 * @return {number} Current document height.
 */
function _get_doc_height() {
    return Math.max(
        document.body.scrollHeight || 0, documentElement.scrollHeight || 0,
        document.body.offsetHeight || 0, documentElement.offsetHeight || 0,
        document.body.clientHeight || 0, documentElement.clientHeight || 0
    );
}


/**
 * Get current vertical scroll percentage
 *
 * @return {number} Current vertical scroll percentage.
 */
function _get_scroll_percentage() {
    return (
        (_get_window_Yscroll() + _get_window_height()) / _get_doc_height()
    ) * 100;
}

var _t = null;
var _max_scroll = 0;
function _update_scroll_percentage(now) {
    if (_t) {
        clearTimeout(_t);
    }
    if (now === true) {
        _max_scroll = Math.max(_get_scroll_percentage(), _max_scroll);
        return;
    }
    _t = setTimeout(function () {
        _max_scroll = Math.max(_get_scroll_percentage(), _max_scroll);
    }, 400);
}

function _sendMaxScroll() {
    _update_scroll_percentage(true);
    _max_scroll = Math.floor(_max_scroll);
    if (_max_scroll <= 0 || _max_scroll > 100) return;
    var bucket = (_max_scroll > 10 ? 1 : 0) * (
        Math.floor((_max_scroll - 1) / 10) * 10 + 1
    );
    bucket = String(bucket) + '-' +
        String(Math.ceil(_max_scroll / 10) * 10);

    ga('send',
        'event',
        _maxScrollOpts['category'],
        url,
        bucket,
        Math.floor(_max_scroll),
        true // non-interactive
    );
}

/**
 * Tracks the max Scroll on the page.
 *
 * @param {object} opts GAS Options to be used.
 * @this {GasHelper} The Ga Helper object
 */
function _trackMaxScroll(opts) {
    if (!this._maxScrollTracked) {
        this._maxScrollTracked = true;
    } else {
        //Oops double tracking detected.
        return;
    }
    _maxScrollOpts = opts || {};
    _maxScrollOpts['category'] = _maxScrollOpts['category'] || 'Max Scroll';

    this._addEventListener(window, 'scroll', _update_scroll_percentage);
    this._addEventListener(window, 'beforeunload', _sendMaxScroll);
}

_trackMaxScroll();
&#13;
&#13;
&#13;