Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add custom marks and custom percentage gap #81

Open
wants to merge 11 commits into
base: master
Choose a base branch
from
34 changes: 22 additions & 12 deletions jquery.scrolldepth.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,9 @@
gaGlobal: false,
gtmOverride: false,
trackerName: false,
dataLayer: 'dataLayer'
dataLayer: 'dataLayer',
markGap: 25,
customMarks: [],
};

var $window = $(window),
Expand Down Expand Up @@ -147,14 +149,23 @@

}

function calculateMarks(docHeight) {
return {
'25%' : parseInt(docHeight * 0.25, 10),
'50%' : parseInt(docHeight * 0.50, 10),
'75%' : parseInt(docHeight * 0.75, 10),
// Cushion to trigger 100% event in iOS
'100%': docHeight - 5
};
function calculateMarks(docHeight, gap, customMarks) {
var marks = {};
gap = (!gap) ? 25 : gap;

for (var i = 1; i <= (100/gap); i++) {
marks[gap*i+'%'] = parseInt(docHeight*gap*i/100, 10);
}

if (customMarks.constructor === Array) {
customMarks.forEach(function (mark) {
marks[mark + '%'] = parseInt(docHeight * mark / 100, 10);
});
}

marks['100%'] = docHeight - 5;

return marks;
}

function checkMarks(marks, scrollDistance, timing) {
Expand Down Expand Up @@ -292,8 +303,8 @@
winHeight = window.innerHeight ? window.innerHeight : $window.height(),
scrollDistance = $window.scrollTop() + winHeight,

// Recalculate percentage marks
marks = calculateMarks(docHeight),
// Recalculate percentage marks
marks = calculateMarks(docHeight, options.markGap, options.customMarks),

// Timing
timing = +new Date - startTime;
Expand Down Expand Up @@ -324,5 +335,4 @@

// UMD export
return $.scrollDepth;

}));
5 changes: 3 additions & 2 deletions test/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -45,12 +45,13 @@ <h1>jQuery Scroll Depth Test Page</h1>
elements: ['#main'],
userTiming: false,
percentage: false,
pixelDepth: false
pixelDepth: false,
customMarks: [10, 30, 80, 91],
//gtmOverride: true,
//eventHandler: function(data) {
//log(data)
//}
});
</script>
</body>
</html>
</html>