Highlighted

Javascript extention does not sett variable

Silver Contributor
Silver Contributor

Hi guys hope you can help.

I'm trying to implement scrolltracking using the javascript extention, but ive encountered a problem.

var scrolledPast75 = false;
var scrolledPast50 = false;
var scrolledPast25 = false;
var scrolledTo100  = false;

var startscroll = Date.now();


polls = window.setInterval(function()
{
try {
		var winmax = document.body.scrollHeight - window.innerHeight
    	scrolled = window.pageYOffset/winmax;
    	
	if ( scrolled > 0.97 && scrolledTo100 == false){
		scrolledTo100 = true;
		scrolled100Time=Date.now();
		utag.link({ 
			event_category:"Scroll Depth", 
    		event_action:"Scroll", 
    		event_lable:"100%",
    		event_value:String(100),
    		time_to_action: String((scrolled100Time-startscroll)/100/60),
    		pixel_depth: String(window.innerHeight)
  		});
		
		
    }
	if(  scrolled > 0.75 && scrolledPast75 == false){
		scrolledPast75 = true;
		scrolled75Time=Date.now();
		utag.link({ 
			event_category:"Scroll Depth", 
    		event_action:"Scroll", 
    		event_lable:"75%", 
    		event_value:String(75),
    		time_to_action: String((scrolled75Time-startscroll)/100/60),
    		pixel_depth: String(window.innerHeight)
  		});
	
    }
	if(scrolled > 0.50 && scrolledPast50 == false){
		scrolledPast50 = true;
		scrolled50Time=Date.now();
		utag.link({ 
			event_category:"Scroll Depth", 
    		event_action:"Scroll", 
    		event_lable:"50%", 
    		event_value:String(50),
    		time_to_action: String((scrolled50Time-startscroll)/100/60),
    		pixel_depth: String(window.innerHeight)
  		});
	

    }
    if(scrolled > 0.25 && scrolledPast25 == false){
		scrolledPast25 = true;
		scrolled25Time=Date.now();
		utag.link({ 
			event_category:"Scroll Depth", 
    		event_action:"Scroll", 
    		event_lable:"25%", 
    		event_value:String(25),
    		time_to_action: String((scrolled25Time-startscroll)/100/60),
    		pixel_depth: String(window.innerHeight)
  		});
	
    }
    if(scrolledPast75 == true && scrolledPast50 == true && scrolledPast25 == true && scrolledTo100 == true){
    window.clearInterval(polls);
    }
    }
catch (err){
}
}, 500);

this is the code I'm using, and if i enter it in to the console it works like a charm.

but if i use the javascript extention

var scrolledPast75 = false;
var scrolledPast50 = false;
var scrolledPast25 = false;
var scrolledTo100  = false;

 these vars are not set, and my script loops every 500 ms if any condition is met.

 

Can you guys see what im doing wrong?

4 REPLIES 4
Highlighted

Javascript extention does not sett variable

Silver Contributor
Silver Contributor

If I use the Tealium custom container the exact same script works.

Is there a reson why thats the case?

Highlighted

Javascript extention does not sett variable

Employee Emeritus

@Bknapstad try wrapping your code in an anonymous function and pass it window. Should be scoped to DOM Ready in the extension.

(function(){

  //your code here

})(window);

 

Highlighted

Javascript extention does not sett variable

Silver Contributor
Silver Contributor

Thank you!

 

This worked. Do you recomend using the javascript extention or a custom tag?

Highlighted

Javascript extention does not sett variable

Employee Emeritus

An extension would be the proper place because it not loading any kind of tag or making any request. It's just providing data to the tags.