Bootstrap: better Affix…

I love Twitter’s Bootstrap framework. I don’t think I say that enough. It makes structuring beautiful websites extremely easy and quick. Their JavaScript framework makes it so much simpler to implement most commonly used animations. It does so by adding a few jQuery plugins that can be invoked by making additions to the markup or with some minimal scripting.

One such plugin is Affix that comes in the standard compiled bootstrap.js file or as affix.js if you prefer compiling them yourself. It allows dynamically changing the position of an element based on the scroll position. All you have to do include the attributes data-spy="affix" and data-offset-top="xx" and optionally data-offset-bottom="yy" where xx and yy are numerical values in pixels of your top and bottom offsets. It works by comparing how far you’ve scrolled the document.

Open external links in a new tab by default…

Opening links in a new browser tab is easy – right click on one and from the context menu that appears opt to ‘Open in a new tab’. You can also do that with a middle click on your mouse or with a left mouse click while holding the Ctrl key. It’s nicer if you make it so that a link opens in a new tab by default – attaching the target=_blank attribute to those anchor tags.

Bootstrap: ScrollSpy tips…

ScrollSpy is a handy JavaScript feature in Twitter’s Bootstrap framework. With a help of a little creative CSS and perhaps a bit more JavaScript, it is capable of facilitating beautiful scroll position activated animations.

The documentation however makes it appear extremely restrictive. As of this day, they’ve mentioned that ScrollSpy requires a Bootstrap nav component, but that’s simply not the case. In general ScrollSpy, untouched and unchanged can do a lot more than described. Usually, finding that out requires a lot of hard work, but you have me now.

Roman Numerals

A few months ago, I had posted two videos about Roman Numerals.

In the first one, titled Roman Numerals, I spoke about the Roman Numeral system itself. I started with numerical face values and how the numbers were supposed to be written down. The numbers are inherently additive. However, we’ve often seen the subtractive forms of the same numbers and I’ve talked about that at length. Plus, I’ve also discussed addition and subtraction, both in the additive and subtractive forms of the operands.

Bootstrap: Tooltips for Modal buttons…

I’m a huge fan of Twitter’s Bootstrap framework. It’s a set of free-to-use stylesheets and scripts that gets you started on designing well laid out, mobile responsive sites. This site of mine, right here, uses it. It simplifies front-end development and amazing looking websites can be rolled out quickly with it.

Just like every plugin out there, this too has minor kinks and annoyances. And just like every other plugin, there’s always a fix. This post is about one of them.