This site is built with ZURB Foundation, which is awesome. But when I was adding this blog to the site, I decided I wanted the stuff in the right column to stay visible all the time. (If you're reading this in an RSS reader, head over to the blog to check it out.) Foundation doesn't really have a component that does that (except for a sticky top nav bar, which doesn't help me). But Bootstrap does have a component that fits the bill.
You can see the component in action on the Bootstrap site here. As you scroll, the nav on the right gets pinned in place. That's exactly what I wanted. But this is Bootstrap and I'm using Foundation. What to do?
Well, it turns out that lots of things in Bootstrap (such as this) are implemented as standalone modules. (The same is true of Foundation.) Which means you can just grab the relevant file and start using it on your own site. So that's exactly what I did. All you need to do is grab the file and put it in Foundation's Javascript folder. (I just copied it and pasted it into a new file.)
Then you can include it in your page, add one line of code to your $(document).ready() function to attach the behavior to the relevant element, and you're done. Almost done anyway. In the case of this specific module, you need to add a couple of data attributes to the element's HTML and a couple of CSS rules, but nothing too complicated.
I also had to tweak a few things to make it work properly. For example, my footer was really big, and this made it hard to get it to behave correctly, so I made the footer a bit smaller. And because Foundation's grid is more fluid than Bootstrap's, I had to make the element that gets pinned fixed width.
But if you're OK making compromises like these, you can achieve quite impressive results. So if you're already using a particular front-end framework, don't be afraid to borrow from one of the others. It works, and you'll always learn something new in the process.