G'day. I have written a jQuery style method to solve a specific UI
issue for which I have yet to see another solution.
What I want to do, essentially, is to have a block element grow so that
it is at least as tall as another element -- a sidebar that can be
taller than the content block (of variable and unknown size), but never
shorter.
Anyway, short of JavaScript or nasty structural hacks I wrote some
jQuery code to provide the implementation. I am not very familiar with
jQuery yet, though, and would love any criticism or suggestions you
might have.
The code is:
jQuery.fn.matchHeight = function (src) {
// Wrap the first target element is jQuery.
var target = this;
var src = $(src)[0];
var j = $(src);
// Hook any resize of the target to change our size
j.resize(
function(){
var h = this.offsetHeight;
$(target).height(h + 'px');
if (target.offsetHeight > h) {
$(target).height((h - (target.offsetHeight - h))+'px');
}
}
);
// Fire a resize event to establish our size.
$(function () { j.resize(); });
}
Usage is simple: $('#sidebar').matchHeight('#content');
The code to set the object height is based on the vjustify plugin,
linked from the jQuery home page, and works very well.
I have tested this and it works, but specifically:
Is hooking 'resize' on a random DIV actually useful? My hope is that if
content is dynamically added to the target element it will cause the
sidebar to grow along with it.
Is there some better way for me to address the source specifier? The
code I have extracts a single element, then wraps it in a jQuery object
again.
I think that should work no mater what jQuery style content is passed --
existing objects, an array, a match rule, etc -- but if there is a nicer
way...
Is using '$(document).ready()' and simulating the event the best way to
trigger the first time resize, or would I be better off calling my
closure directly?
I look forward to comments; I am putting the code is available the same
license as jQuery itself, if anyone cares.
Regards,
Daniel
--
Digital Infrastructure Solutions -- making IT simple, stable and secure
Phone: 0401 155 707 email: [EMAIL PROTECTED]
http://digital-infrastructure.com.au/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
