Skip to content

Instantly share code, notes, and snippets.

@fergusKe
Last active November 2, 2020 08:46
Show Gist options
  • Save fergusKe/3a9347cca83ef464b270f4ac4bb75a6d to your computer and use it in GitHub Desktop.
Save fergusKe/3a9347cca83ef464b270f4ac4bb75a6d to your computer and use it in GitHub Desktop.
<script>
(function($) {
var dataLayer = window.dataLayer || [];
var eventCategoryString = '和運長租tesla租賃';
var $window = $(window);
var currentArea = '';
var areaShowed = [];
var areaEle = {
0: {ele: '.kv-img', label: 'tesla綠動租賃專案'},
1: {ele: '.content-p1 img', label: '輕鬆入主tesla'},
2: {ele: '.about-tt > img', label: '駕馭綠動專屬優惠'}
}
$('.logo a').on('click', function() {
pushDatalayer('LOGO點擊', '和運租車');
});
$('.pc-rbt a').eq(0).on('click', function() {
pushDatalayer('右方浮動按鈕點擊', '進一步洽詢');
pushDatalayer('右方浮動按鈕區塊滾動點擊', '進一步洽詢-' + currentArea);
});
$('.pc-rbt a').eq(1).on('click', function() {
pushDatalayer('右方浮動按鈕點擊', '回到首頁');
pushDatalayer('右方浮動按鈕區塊滾動點擊', '回到首頁-' + currentArea);
});
$('.mb-dbt a').eq(0).on('click', function() {
pushDatalayer('右方浮動按鈕點擊', '進一步洽詢');
pushDatalayer('右方浮動按鈕區塊滾動點擊', '進一步洽詢-' + currentArea);
});
$('.mb-dbt a').eq(1).on('click', function() {
pushDatalayer('右方浮動按鈕點擊', '回到首頁');
pushDatalayer('右方浮動按鈕區塊滾動點擊', '回到首頁-' + currentArea);
});
$window.scroll(function() {
for(idx in areaEle) {
// 顯示過的區塊
if(isScrolledIntoView(areaEle[idx].ele) && areaShowed.indexOf(areaEle[idx].ele) === -1) {
var action = '區塊滾軸';
var label = areaEle[idx].label;
// console.log('label = ', label);
pushDatalayer(action, label);
// 送過刪除
// delete areaEle[idx];
areaShowed.push(areaEle[idx].ele);
}
// 當前區塊
if (isScrolledIntoView(areaEle[idx].ele)) {
currentArea = areaEle[idx].label;
}
}
// console.log('currentArea = ', currentArea);
}).scroll();
function isScrolledIntoView(pEle) {
var $ele = $(pEle);
var eleTop = $ele.offset().top;
var eleHeight = $ele.height();
var eleHalfHeight = eleHeight / 2;
var windowHeight = $window.height();
var windowHalfHeight = windowHeight / 2;
var scrollTop = $window.scrollTop();
var scrollPosition = scrollTop + windowHeight;
// 滑到項目顯示出一半的位置 || 螢幕一半的位置
return (scrollPosition >= eleTop + eleHalfHeight) || (scrollPosition >= eleTop + windowHalfHeight)
}
function pushDatalayer(thisAction, thisLabel) {
dataLayer.push({
event: 'cusevent',
eventCategory: eventCategoryString,
eventAction: thisAction,
eventLabel: thisLabel
});
}
})(jQuery)
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment