jQuery on DerekAllard.com : DerekAllard.com

jQuery on DerekAllard.com

April 24^th, 2008

I’ve been saying for a little while now that I’ve fallen in love with jQuery, and I mean, who hasn’t? I’m so impressed with it, and so are the other smart people at EllisLab, that we’re integrating it into CodeIgniter, and into ExpressionEngine. But this blog still doesn’t use it. If you poke into the source code, you’ll see Mootools.


<script type="text/javascript" src="/js/mootools.js"></script>

So I’ve been wanting to migrate my own code to recently out of Moo, and into jQuery. This will let me do a few things, not the least of which is apply the CI jQuery library in another real-world test case. So why haven’t I moved it yet? Well, a quick audit of my code, and the only thing I’m using Moo for is the fancy lightbox effect on my about page, and several posts. It actually is Slimbox, a clone of Lokesh Dhakar’s excellent (and popular) Lightbox. So the short answer, is that I didn’t want to migrate the legacy code.

Then it dawned on me, my code is all semantic and clean, there’s no javascript hooks, the only markup used to implement lightbox is


<a rel="lightbox" href="something">...</a>

so it should be an easy replacement. Then yesterday, (via Ed Finkler’s Funkatron), I found the jQuery Lightbox plugin. How is it that I only just yesterday found this?

A quick look, and it seems to be solidly written, the semantics are the same, and it should be (apologies to Ron Popeil) the “set it and forget it” solution I’ve been looking for.

So in the next few days, the plan is to migrate DerekAllard.com to jQuery, and start adding a bit more sexiness into the robot.

Next post: my favourite jQuery plugins ;)

This entry was made on April 24^th, 2008 @ 19:35 and filed into Javascript, Noteworthy.

Comments

Willem wrote on April 25^th, 2008 @ 1:07

Hi Derek. jQuery rulez yeah!! After the announcement that EE wil use jQuery in the 2.0 version i had a look at jquery and it looks great!

Immediately i’ve tested some plugins and saw a beautifull one for showing pictures on my weblog entry’s.

Look at http://www.f1crew.nl/index/new where i uses jQuery in a combination with highslide.

Look forward to all the stuff that comes in 2.0 with jQuery, it will be awesome i think.

Lorenzo wrote on April 25^th, 2008 @ 1:09

If you want you could try the shadowbox, I think this the smoothest “box” I found until now:
http://mjijackson.com/shadowbox

And it has adapters for all the popular javascript library around

Christophe Lance wrote on April 25^th, 2008 @ 1:15

It does exist another jquery Lightbox effect: Thickbox http://jquery.com/demo/thickbox/ which supports ajax, iframe or flash. But I am happy to discover this one.

Elliot Haughin wrote on April 25^th, 2008 @ 2:32

Great news Derek!
I’ve just started getting into jQuery, moving away from scriptaculous. I must say, I am falling in love with it too.

Looking forward to seeing some of the sexy stuff you’re going to put up here!

Elliot

Grant wrote on April 25^th, 2008 @ 2:46

Hey Derek, looking forward to lots of CI+jquery goodness. Do you know when the next release is coming?

Delapouite wrote on April 25^th, 2008 @ 2:55

Hi Derek.

Can you explain briefly the cons that make you quit the Mootools boat ?

Alex wrote on April 25^th, 2008 @ 3:51

I’m a little curious myself - what made you switch? :)

George Ornbo wrote on April 25^th, 2008 @ 6:01

I *really* like the ability to use CSS selectors in jQuery to navigate and manipulate the DOM.

If you have got well formed, semantic HTML it gives more value to the credo of total separation of behavioral and presentational layers.

I am sure that John Resig is acutally about 15 mega computers hooked together at Mozilla.

Steve wrote on April 25^th, 2008 @ 8:42

I’m also interested to hear how jQuery is going to be integrated into CI. I currently use it in all my projects along with CI so tho have them both together could be a treat.

Derek wrote on April 25^th, 2008 @ 9:57

Its not that I don’t like Mootools anymore, its just that I like what jQuery offers me more.

Technically, I love the css expressions, I love the looping syntaxes, I love the internal consistency, I love that jQuery plays nice with other javascript frameworks. I love that it insulates me from varied and crazy browser implementations, I love the speed, I love the memory footprint. I find the code, not only in the main library, but also in the prominent plugins, to be of very high quality.

Non-technically, I love the community around jQuery. I love the documentation. I respect John Resig immensely, I like that jQuery recognizes when it can do better and works towards that. I love that the brains in the jQuery community share by blogging, posting videos, doing speeches. I feel that the jQuery community is at a nice level of big, but not too big. It just fits in with where I want to be.

To be clear, I’m not saying that other javascript frameworks don’t offer these (and I know for a fact that some do), its just that I know jQuery offers this, and I love it.

With respects to how jQuery will be integrated with CodeIgniter, I gave some information in my blog post ExpressionEngine 2.0: fully CodeIgnited! and more information in my my South by Southwest speech. More information will leak out over time.

Richard wrote on April 26^th, 2008 @ 15:01

Hey Alex,

Nice find, I also use facebox - http://famspam.com/facebox

You can also hit the play button to create a slideshow.

Nick Husher wrote on April 26^th, 2008 @ 19:25

I’ve been very impressed with a lot of what jQuery has to offer. I haven’t had time to find out if it can handle the complex stuff I do regularly with YUI, but I’ve thought seriously about moving to a YUI-for-custom-widgets-only approach with jQuery doing the simple form validation and event handling stuffs.

paul wrote on May 14^th, 2008 @ 17:03

Didn’t quite get round to it then, eh?

Derek wrote on May 28^th, 2008 @ 6:42

Well… embarrassed to admit that I didn’t get this done until this morning. It took < 5 minutes. Sheesh. 3 cheers for procrastination!

DerekAllard.com : CodeIgniter, ExpressionEngine, and the World of Web Design

jQuery on DerekAllard.com

Comments

Post a Comment