German Rumm’s blog

This is probably an old news, but jQuery 1.3 has been released January 14.

Now jQuery includes what was previously known as livequery plugin. Now you can program the future Meaning you can attach events to elements that are not in the page (yet). I remember hard time I had (when I didn’t know about livequery) when doing AJAX-pagination for comment moderation module. It was like:

1. Attach click events to delete links, to hide links, to pager links etc…
2. Once the new page is loaded, attach click events again to delete links, to hide links …

Now it’s

('a.delete').live('click', deleteComment);
('a.screen').live('click', screenComment);

and that’s it – all future elements will have events attached to them automatically.

jQuery also moved their selector engine to separate object. Now it’s called Sizzle and is completely standalone.

And jQuery is now much faster (and that’s always a good thing). View the graphs on release page and see for yourself.

Need jQuery sIFR for a project I am currently working on. Found 2: one by Gilles van den Hoven and another by Jonathan Neal. Liked the second one – documentation, plenty of options, custom callbacks and this one is based on a wonderful flash plugin by Luke Lutman.

Unfortunately both don’t support transparency nor custom background, only background color. At least I couldn’t make it work. wMode=”transparent” didn’t help, setting bgColor to empty(“none”/”transparent”) didn’t work as expected. Will have to look into .fla file, but for that I have to boot into my Windows, and I so-o-o don’t want to do it

P.S. sIFR3 Alpha doesn’t support transparent backgound neither.

Took Mika’s advice, decided to try out Thickbox Reloaded. Still not what I was looking for. Yeah, it looks much more jquery-like, but it still doesn’t provide any extra functionality, compared to original thickbox.

It allows passing options, but unfortunately those options are of no use to me. Those options control thickbox dimensions (top, left, width/minWidth, height) and localization.

Decided to try out jqModal, now that thing is way more powerful. It doesn’t have any built-in design like thickbox, so you have to create your own window layout, but it allows attaching handlers to onHide(), onShow() and onLoad() events. It allows controlling jqModal programmatically using jqmShow() and jqmHide(). It allows adding custom triggers on-the-fly and it even allows opening several dialogs simultaneously.

So, it basically has everything you might possibly need, stuffed in a 3 Kb file.

Useful link

Tutorial describing loading external content into IFRAME

jQuery Thickbox is one of the plugins I constantly use when developing web-sites. Not for the image/gallery functionality, but because of the inline/AJAX/IFrame content. Before I had to use window.open() and write rather complex javascript for passing data back to the opener window.

One thing lacking is a good documentation: examples help, but I prefer more conventional style of documentation – with all options explained, and default values given.

One thing that gave me some problems was the iframe option – query string was always truncated, so I couldn’t pass parameters to iframed page.

Today I found answer to my problem – all ThickBox parameters should be added after TB_iframe=true, since query string gets truncated after that.

One good thing about it – no junk parameters are passed to the page you are calling.

Example: You need to call the “pictures.php?album_id=23″ page in Thickbox iframe. You need to add TB_iframe=true to URL (and class=”thickbox” to an element) to activate Thickbox onclick. So, URL should look like this: pictures.php?album_id=23&TB_iframe=true (or even pictures.php?album_id=23&TB_iframe=true if you want to keep your HTML well-formed). That way only album_id will be passed to pictures.php – all other parameters will be stripped out.

KeepThis=true in examples is just for illustrative purposes only – Thickbox doesn’t need it and never uses it.

P.S. I don’t like the way ThickBox currently works – I want to be able to attach thickbox to elements using more traditional jquery approach, like this:

$('a.thickbox').thickbox({width: 400, height: 400});

Unfortunately, currently there’s no such functionality.