How did I not know about this? Sheesh, what a great time-saver!
I also had a similar issue; nice job noticing the update.
jQuery 1.10.0 supports IE 7 and 8 ;)
Nice script.
Here are a couple of things that I would change:
Store $(this) inside a variable (perhaps $this) as this will help make your code more readable when it starts to get lengthy.
Chain whenever possible. For example: $(this).attr('checked', false).attr('checkstate', 'false');
You started by storing $(this) in a variable called "$this" but then referenced $(this) throughout the rest of your code; I would use the variable you created.
For example:
var ref = $this.data('toggle');
I completely concur; jQuery's ease of use is both it's greatest blessing and it's greatest weakness because everything is so simple these days that developers often forget that there may be a quicker/more efficient way of achieving the same result with native JS.
This is very helpful for TypeKit fonts.
Google and TypeKit worked together to develop the "Web Font Loader" which works in a similar way and supports both Typekit and Google Web Fonts (amongst others).
Here's the GitHub repo: https://github.com/typekit/webfontloader
I've only just started to use iTerm2 and it's already saving me an unbelievable amount of time. Gotta love the hotkey "drop-down" window! Now with this funky tip, I can pack more into a single glance.
@jiewmeng that's the most beautiful thing about jQuery 2; it has dropped support for IE 7 and 8 so future clients will be told that certain aspects of their websites will be held back if IE 7/8 needs to be supported, which, hopefully, will push clients to say "okay, let's focus on IE9+" which would push users of these older browsers to upgrade once and for all!
That, my friend, is beautiful! :D
"Keep things generic and re-usable." is one of the golden CSS rules that I always remind myself of whilst developing styles.
This is a nice post but I'm afraid that many of us will still need to go through the pain of supporting older browsers (although, hopefully not much longer!) which would, subsequently, realistically require the use of jQuery.
But you have a good point in regards to jQuery 2.
Nice, but your positioning for .canvas-pattern-left has a typo after it as it is using a colon rather than a semi-colon. Nice example though.
I would also recommend using a CSS pre-compiler such as SASS as this enables you to use very simple syntax such as the following which will create an image embedded into the CSS:
+inlineImage("path-to-image")
Another quick note: be careful not to use too many "inline images" (images embedded into CSS) as it can dramatically increase page load times if the images are considerably large.
I'm a huge advocate for using git fetch and then deciding upon relevant action.
I completely agree; PhpStorm helped me to better follow coding guidelines as well as helping me to spot bugs and typos. Would highly recommend PhpStorm to any web developer.