So today I was integrating Google’s Picasa API with my Webflow site and noticed that the Webflow “Light Box” wasn’t working as expected after grabbing the Picasa assets via
After a quick look at the Webflow.js, it was apparent that it initializes the lightbox stuff on load, and is not watching the DOM for new nodes with the
w-lightbox class. Anyway, no big deal, I was able to re-initialize the lightbox code via
$('.w-lightbox').webflowLightBox() (after digging into the code a bit more) and my integration worked fine.
After that, I wanted to figure out how to “pad” or “offset” the scroll-to-anchor behavior to compensate for my fixed header. I read that Webflow requires certain conditions (eg.
<header> directly on
<body>, etc.) and it just worked. Well that’s wonderful – no hacking necessary. I just changed my
<div> out for a