Last active
November 2, 2020 08:46
-
-
Save fergusKe/3a9347cca83ef464b270f4ac4bb75a6d to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<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