Tealium Learning Center

@jason_paddock, @kathleen_jo - Thanks @john_oren   1) We used some of the logic in your code and mixed/matched with a piece of code I found on http://editor.javascriptkit.com/?eg=scrolltop-pct2 2) The reason we needed to persist the scrolled value was we wanted to wait until we got to the next page to pass the percent page scrolled to s.prop65. So prop64 (which is the previous page URL) and prop65 (which is the percent scrolled on the previous page) can be co-related. But I removed the persist data on percentage scrolled because it was causing issues   So here is the JS code we have now that is working. Unfortunately the code sets the ppscroll cookie for a day. We are still figuring out how to set the ppscroll cookie just for a page view. But the code works for now:     function getDocHeight() { var D = document; return Math.max( D.body.scrollHeight, D.documentElement.scrollHeight, D.body.offsetHeight, D.documentElement.offsetHeight, D.body.clientHeight, D.documentElement.clientHeight ); } var winheight, docheight, trackLength, throttlescroll; function getmeasurements(){ winheight= window.innerHeight || (document.documentElement || document.body).clientHeight; docheight = getDocHeight(); trackLength = docheight - winheight; } function getCookie(cname) { var name = cname + "="; var ca = document.cookie.split(';'); for(var i = 0; i <ca.length; i++) { var c = ca[i]; while (c.charAt(0)==' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length,c.length); } } return ""; } function setCookie(c_name, value, exdays) { var exdate = new Date(); exdate.setDate(exdate.getDate() + exdays); var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString()) + "; path=/"; document.cookie = c_name + "=" + c_value; } function amountscrolled(){ if (ppscrollcookie == null || ppscrollcookie == "") { var scrollTop = window.pageYOffset || (document.documentElement || document.body.parentNode || document.body).scrollTop; var percentScrolled = Math.floor(scrollTop/trackLength * 100) // gets percentage scrolled (ie: 80 or NaN if tracklength == 0); var percent_page_scrolled = "0"; if(percentScrolled > 0 && percentScrolled <= 25) { percent_page_scrolled = "25"; setCookie("ppscroll", percent_page_scrolled, 1); } else if (percentScrolled > 25 && percentScrolled <= 50) { percent_page_scrolled = "50"; setCookie("ppscroll", percent_page_scrolled, 1); } else if(percentScrolled > 50 && percentScrolled <= 75) { percent_page_scrolled = "75"; setCookie("ppscroll", percent_page_scrolled, 1); } else if(percentScrolled > 75 && percentScrolled <= 100) { percent_page_scrolled = "100"; setCookie("ppscroll", percent_page_scrolled, 1); } console.log(percent_page_scrolled); } else { setCookie("ppscroll", ppscrollcookie, 1); } } getmeasurements(); var ppscrollcookie = getCookie('ppscroll'); console.log("Scroll Percent Present--> "+ppscrollcookie); window.addEventListener("resize", function(){ getmeasurements(); }, false); window.addEventListener("scroll", function(){ clearTimeout(throttlescroll) throttlescroll = setTimeout(function(){ // throttle code inside scroll to once every 50 milliseconds amountscrolled(); }, 50) }, false); ... View more

@kathleen_jo @jason_paddock   Hey Kathleen, (and Jason), thanks so much for sharing both the jQuery and the JS versions. The jQuery version seems to work well with our Tealium implementation. The Javascript version for unknown reasons breaks our Tealium utag. Here is what we did to integrate the jQuery script but for some reason we have not been successful yet in getting the data out to our s.prop65 (which is the SiteCatalyst variable that receives the percent page viewed value and populates our reporting suites in SiteCatalyst):   Copied the jQuery code from @jason_paddock, pasted it into an extension called pp_scroll. The pp_scroll is a javascript extension scoped to all tags. In the data layer created 2 variables percent_page_scrolled as a UDO variable ppscroll as a first-party cookie Created a jQuery onHandler called percent_page_scrolled. Here is how we configured it: Scoped to DOM Ready Passed * to jQuery Selector Set Trigger on to mousedown Set tracking event to link Set percent_page_scroll to $window.on(‘scroll’, function ()); We then created persist data value extension called Persist ppscroll. Here is how we configured that one: Scoped it to all tags Persist variable percent_page_scroll Duration: session Update: Allow update on page view Condition: percent_page_scrolled  is populated Store in cookie: ppscroll Finally in the Tags -> Appmeasurement for SiteCatalyst we have set ppscroll to pass the value to prop65 We pushed this to our QA environment.So far it has not broken our existing implementation but we do not see the prop65 receiving the percent scrolled value. Any ideas where we can improve or change what we have done?   Any light that you can shed on this would be very much appreciated!!   Thanks! ... View more

@kathleen_jo Thank you so much! ... View more

@adrian_browning what page of ours did you see this happen? Would you be able to share a screenshot of what you noticed happen on our page? ... View more

@adrian_browning Thank you! We already did that. Probably sometime next week we may hear back from Tealium Support. ... View more

@meng_lim unfortunately no - its not firing. The report has no data. We have had this implementation for the last two years. While all the other plugins are working normal, the percentage page viewed does not fire.   We have the percentage page viewed plugin in one sitecatalyst extension and the doPlugins function in another sitecatalyst extention. Within the doPlugins function we invoke the percentage pageviewed plugin and pass the value to a prop:   s.prop64 = s.getPreviousValue(s.pageName, 's_ppn'); s.prop65 = s.getPercentPageViewed(); if(!s.prop64 || s.prop64 == 'no value') s.prop65 = '';   The percentage page viewed plugin that we have has the following code: s.getPercentPageViewed=new Function("pid","" + "pid=pid?pid:'-';var s=this,ist=!s.getPPVid?true:false;if(typeof(s.l" + "inkType)!='undefined'&&s.linkType!='0'&&s.linkType!='e')return'';va" + "r v=s.c_r('s_ppv'),a=(v.indexOf(',')>-1)?v.split(',',4):[];if(a&&a." + "length<4){for(var i=3;i>0;i--){a[i]=(i<a.length)?(a[i-1]):('');}a[0" + "]='';}if(a)a[0]=unescape(a[0]);if(ist){s.getPPVid=(pid)?(pid):(s.pa" + "geName?s.pageName:document.location.href);s.c_w('s_ppv',escape(s.ge" + "tPPVid));if(window.addEventListener){window.addEventListener('load'" + ",s.handlePPVevents,false);window.addEventListener('scroll',s.handle" + "PPVevents,false);window.addEventListener('resize',s.handlePPVevents" + ",false);}else if(window.attachEvent){window.attachEvent('onload',s." + "handlePPVevents);window.attachEvent('onscroll',s.handlePPVevents);w" + "indow.attachEvent('onresize',s.handlePPVevents);}}return pid!='-'?a" + ":a[1];");   Are we missing anything here?  ... View more