Scrollify
Scrollify copied to clipboard
Can't scroll properly on section with iframe element
I have a 100VH section with an iframe element inside.
When scrolling with the cursor, there is some sort of overflow on that exact section. But everything works well if you scroll with the arrows.
https://www.useloom.com/share/038734866d2d4f26957413266ae3fe17 This is the div http://emilianogioia.com.ar/wips/mooco/creative.html#reel
Hi, I may be able to find a solution
Js:
$('.ClassCSS') .click(function(){ $(this).find('iframe').addClass('clicked')}) .mouseleave(function(){ $(this).find('iframe').removeClass('clicked')});
Css:
.ClassCSS iframe{ display: block; width: 100%; position: relative; pointer-events: none; } .ClassCSS iframe.clicked{ pointer-events: auto; }
@emilianog94 Did you ever find a solution for this bug? I'm running into the same issue now.
Same issue!
@kvntssr's solution worked with a few tweaks specific for my situation. Although the downside is that if you scroll on the iframe without having triggered the class removal (i.e. having kept the mouse on it at all times after clicking it), then the problem is back (albeit briefly).
Would be nice to be able to detect scroll events that affect the whole page from inside an iframe and override them with Scrollify. But don't really know enough about how Scrollify handles events to propose something.