search

adchsm / Slidebars

Slidebars is a jQuery Framework for Off-Canvas Menus and Sidebars into your website or web app.
http://www.adchsm.com/slidebars/
MIT License
1.5k stars 307 forks source link

jQuery Waypoints #260

Open tomislavboric opened 8 years ago

tomislavboric commented 8 years ago

Hi, just figured out, after few hours of troubleshooting - that Waypoints don't work when I use Slidebars page layout. Problem is that Waypoints can't trigger elements while scrolling. As soon as I removed div's that belongs to Slidebars it worked!

Is there some quick fix for that? Maybe some overflow..somewhere?

Thanks so much for any help

apuntovanini commented 7 years ago

+1 thanks

JoryHogeveen commented 7 years ago

Might be a CSS issue related to these topics:

https://github.com/adchsm/Slidebars/issues/251 https://github.com/adchsm/Slidebars/pull/257

guyhamilton commented 7 years ago

I believe this is due to the container setup Slidebar uses. Basically when scrolling the page you are not scrolling the body anymore, you are scrolling the canvas container. Due to this, waypoints and other plugins that target the body will stop working.

To get waypoints to work, you need to use 'context' (http://imakewebthings.com/waypoints/api/context-option/) to target the new container. I added the ID canvas to the canvas container and waypoints now works as it should.

var waypoint = new Waypoint({ element: document.getElementById('about'), handler: function() { console.log("reached!"); }, context: document.getElementById('canvas') });