Very nice!
A couple of suggestions...
1) Get in the habit of using "var" on all your variable assignments, so you
don't create global variables accidentally.
2) Consider using one of the several DOM creator plugins. You can replace
code like this:
figureFrameInner = document.createElement('div'); // This is a wrapper on
the entire Figure box.
$(figureFrameInner).addClass('inner');
figureFrame = document.createElement('div');
$(figureFrame).addClass('figure-frame').addClass(this.className).width($(thi
s).width()).append($(figureFrameInner));
figureContainerInner = document.createElement('div'); // This will contain
the figure itself.
$(figureContainerInner).addClass('inner').append(theFigure);
figureContainer = document.createElement('div');
$(figureContainer).addClass('figure-container').append($(figureContainerInne
r));
theCutline = $(this).attr('title'); // This will contain the cutline.
cutlineContainerInner = document.createElement('div');
$(cutlineContainerInner).addClass('inner').append(theCutline);
cutlineContainer = document.createElement('div');
$(cutlineContainer).addClass('cutline-container').append($(cutlineContainerI
nner));
$(figureFrameInner).append(figureContainer).append(cutlineContainer);
with something like this:
var figureFrame =
$.DIV({ Class: 'figure-frame ' + this.className, style:{ width:
$(this).width() } },
$.DIV({ Class: 'inner' }, [
$.DIV({ Class: 'figure-container' },
$.DIV({ Class: 'inner' }, theFigure[0] )
),
$.DIV({ Class: 'cutline-container' },
$.DIV({ Class: 'inner' }, this.title )
)
])
);
or, with a different DOM plugin, something like this:
var figureFrame = $.create(
'div', { Class: 'figure-frame ' + this.className, style:{ width:
$(this).width() } }, [
'div', { Class: 'inner' }, [
'div', { Class: 'figure-container' }, [
'div', { Class: 'inner' }, [ theFigure ]
],
'div', { Class: 'cutline-container' }, [
'div', { Class: 'inner' }, [ this.title ]
]
]
]
);
(both untested and probably wrong in some details, but it gives you the
idea...)
-Mike
_____
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Su
Sent: Monday, May 28, 2007 3:37 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] RFC: jQuery Figures/Cutlines plugin
'lo, all. My interests often fall into the range of enabling more
"traditional"(to print) structures/conventions and typography on the web, so
that's where my first shot at a plugin went. It's not particularly
impressive in any programming sense, but I'm fond of it.
See here:
http://pioindustries.com/projects/jquery/jquery-figures
Everything you should need is in the source, including explanation of a few
things that might seem overworked if you don't think of the reasoning, so
please make sure to read before commenting.
Please note this is NOT being offered for production use yet. There are a
couple of issues I need to think about, particularly #1 in the TODO list,
and probably some consolidation to be done. But I wanted to throw it out and
see what people thought or if they broke it.
