Created
June 14, 2013 06:40
-
-
Save TorbenL/5779912 to your computer and use it in GitHub Desktop.
tracking scroll behaviour on single page web design with google analytics
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
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"/> | |
| <title>Single Page Analytics</title> | |
| <script> | |
| var _gaq = _gaq || []; | |
| _gaq.push(['_setAccount', 'UA-XXXXXXX-XX']); | |
| _gaq.push(['_trackPageview']); | |
| (function() { | |
| var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | |
| ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; | |
| var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); | |
| })(); | |
| </script> | |
| <style> | |
| * { margin: 0px; padding: 0px; } | |
| html, body { height: 100%; } | |
| section { height: 100%; } | |
| section.section-a { background: red; } | |
| section.section-b { background: green; } | |
| section.section-c { background: blue; } | |
| section.section-d { background: yellow; } | |
| </style> | |
| </head> | |
| <body> | |
| <section class="section-a"> | |
| Hier steht der viel Inhalt für Bereich A... | |
| </section> | |
| <section class="section-b"> | |
| Hier steht der viel Inhalt für Bereich B... | |
| </section> | |
| <section class="section-c"> | |
| Hier steht der viel Inhalt für Bereich C... | |
| </section> | |
| <section class="section-d"> | |
| Hier steht der viel Inhalt für Bereich D... | |
| </section> | |
| <script src="http://code.jquery.com/jquery-2.0.2.min.js"></script> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> |
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
| $(function(){ | |
| var tracking_active = ''; | |
| var tracking = { | |
| 'section-d': '/bereich-d', | |
| 'section-c': '/bereich-c', | |
| 'section-b': '/bereich-b', | |
| 'section-a': '/bereich-a' | |
| }; | |
| function scrollTrackPageview(){ | |
| var section = ''; | |
| $.each(tracking, function(key, value) { | |
| section = value; | |
| if($(window).scrollTop() >= $('.'+key).offset().top) | |
| return false; | |
| return true; | |
| }); | |
| if(!section || section == tracking_active) | |
| return false; | |
| _gaq.push(['_trackPageview', section]); | |
| //console.log('Bereich: '+section); | |
| tracking_active = section; | |
| } | |
| scrollTrackPageview(); | |
| $(window).on("scroll", scrollTrackPageview); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment