-1

I’m trying to apply Google Analytics event tagging to jQ Cycle pager thumbnails.

Initially I’ve got the main slides working fine with the ga event tracking script applied to those, and thumbnail paging is also working fine at this point. But when I apply the event tracking to the pagerAnchorBuilder callback function the thumbnails just disappear, and the main slides stay visible but stop cycling – effectively the whole thing stops.

I’m using slides with anchor links: http://jquery.malsup.com/cycle/anchor.html and I got around the ‘undefined’ pager quirk via this earlier post: jQuery Cycle plugin pagerAnchorBuilder images becoming undefined – also shown in my code below.

Following is the pagerAnchorBuilder callback I’m trying which works perfectly until I add the ga tracker via the onClick event:

pagerAnchorBuilder: function(idx, slide) {
  var slideurl = $('#slideshow a', this).attr('href');
  return '<li class="slider-thumb"><a href="'+slide.href+'" title="'+slide.title+'" onClick="_gaq.push(['_trackEvent', 'Home-Slider-Thumb', '+slide.title+', '+slide.href+']);"><img src="'+ $(slide).find('img').attr('src')+'" width="50" height="50" class="thumb-image" /></a><p class="slide-caption">'+ $(slide).find('img').attr('alt')+'</p></li>';
}
Community
  • 1
  • 1
redplanet
  • 158
  • 4
  • 17

1 Answers1

1

You're not escaping your quotes. You can't use a single quote inside a single quote; you need to use doubles or escape it.

return '<li class="slider-thumb"><a href="'+slide.href+'" title="'+slide.title+'" onClick="_gaq.push([\'_trackEvent\', \'Home-Slider-Thumb\', \''+slide.title+'\', \''+slide.href+'\']);"><img src="'+ $(slide).find('img').attr('src')+'" width="50" height="50" class="thumb-image" /></a><p class="slide-caption">'+ $(slide).find('img').attr('alt')+'</p></li>';
Christian
  • 19,605
  • 3
  • 54
  • 70