So, I built a small website using Alvaro Trigo's Fullpage.js. I have been trying to incorporate Google DFP ads throughout the site and have had a lot of problems as I am very weak when it comes to Javascript. What I have been able to do so far is to use the afterLoad callback option to include both Google analytics and Jquery DFP. It's very hacky looking, but here is the code I have:
<script>
$(document).ready(function() {
$('#fullpage').fullpage({
anchors: ['home', 'sponsors', 'self-breast-exam', 'screening', 'treatment', '2015-luncheon', '2014-luncheon', 'non-profit-organizations', 'news', 'events', 'contact'],
menu: '#menu',
paddingTop: '37px',
autoScrolling: true,
scrollBar: true,
slidesNavigation: false,
normalScrollElements: ('#feed-control, #feed-control2'),
fitToSection: true,
scrollOverflow: true,
afterLoad:
function(anchorLink, index){
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-3905646-12', 'domain.nl');
ga('send', 'pageview', { 'page': anchorLink, 'title': anchorLink });
$(".selfexamAd").dfp({
dfpID: '422616648',
collapseEmptyDivs: 'original',
sizeMapping: {
'my-default': [
{browser: [1024, 768], ad_sizes: [728, 90]},
{browser: [600, 0], ad_sizes: [468, 60]},
{browser: [500, 0], ad_sizes: [320, 50]},
{browser: [0, 0], ad_sizes: [320, 50]}
]}
});
},
});
});
</script>
This seems to more or less accomplish what I am trying to do, but the problem I am having seems to be with sections that trigger the scrollOverflow option. It seems that scrolling with the mouse wheel stops at the end of sections where the content extends vertically beyond the Viewport. You are then unable to scroll to the next section using the mouse wheel. Sections that don't overflow seem unaffected and scroll normally using the mouse wheel. Does anybody know what I can do to fix the problem?