I’ll try to set my post apart slightly by providing a detailed explanation.
When this blog was still on Tumblr, I blogged about embedding GitHub Gists in Tumblr posts. Doing so has a few advantages:
scripttags throughout your
body. You just include links (
a-style) to your Gists and then a single script—referenced at the bottom of the document—does all the magic.
!importantor making sure your selectors are more specific than theirs.
Back in those days, if I wanted a Gist in a post, I would make a new Gist for every piece of code I wanted to include. That got ugly, though, so I decided I would start making a single multi-file Gist per post, where each “file” was a separate piece of code to be used in the post. This required a few changes to the script.
In a previous post, due to a lack of browser support for CSS media queries (in both mobile and desktop browsers), I came to the unfortunate conclusion that…
Whether you baseline for desktop and use media queries to dynamically assign styles for mobile, or you baseline for mobile and use media queries to dynamically assign styles for desktop, you’re going to leave a non-trivial number of browsers out in the cold.
And then came Respond.js.
Dapper is a great, new (kind of), tiny database object mapper for the .NET framework. Its footprint is a single file. Drop it in your project and it adds a handful of extension methods to the
Dapper’s focus is on speed. According to the project’s home page, it’s barely slower than hand-coding your own mapping with a
SqlDataReader. What those few milliseconds buy you, though, is automatic mapping to your POCOs. Speed isn’t free, though. But I’ll get to that part later.
jQuery Templates is a plugin to jQuery (requiring at least version 1.4.2), so your page will need to reference both jQuery and the templates plugin (in that order).
Open up www.colly.com or lanyrd.com and (assuming you’re using a modern browser) watch what happens as you resize your browser window. As the window size changes, the page’s layout morphs to accomodate the window size. CSS includes a nice feature to target styles to particular media metrics, width being one of them. In real-time, the browser will apply different styles based on the various queries defined in the stylesheet. It’s an incredibly useful feature for targeting your style not only to smaller desktop browsers but to mobile devices as well.
$. Plugins are defined within the module function by declaring functions on the
$.fn objects. Functions declared on
$ are selector-independent and can return whatever the developer chooses. Functions declared on
$.fn are selector-dependent and should return a jQuery object to maintain jQuery’s chainability.