Comments on: Dynamic Grid Layout In JavaScript

By: Zack Grossbart

Zack Grossbart — Sun, 21 Feb 2010 15:34:21 +0000

It should be possible to make the grid work vertically, just change the loop in the alignGrid function. Elements with different heights is a little trickier. You would probably be better off having every grid square the same height and then changing the height of the stuff inside the square.

By: Patrick

Patrick — Sun, 21 Feb 2010 15:29:54 +0000

Sorry, I forgot:

what about elements with different heights ? Can be integrated such functionality with this code ?

By: Patrick

Patrick — Sun, 21 Feb 2010 15:26:59 +0000

really cool,

would be possible to distribute the elements vertically and not horizontally ?
I mean
1 3
2 4

thanks

By: Ben

Ben — Wed, 04 Nov 2009 17:57:10 +0000

Really nice, thanks for sharing

By: Zack Grossbart

Zack Grossbart — Thu, 30 Jul 2009 19:45:44 +0000

Ricardo,

Thank you for your comment and your code suggestions. I used the full JQuery string instead of $ because I wanted to make this sample code more readable. I did the CSS as separate calls for the same reason. However, I should definitely change the deployed code at Get The Eye to combine the CSS calls.

Thanks,
Zacl

By: Ricardo

Ricardo — Thu, 30 Jul 2009 19:31:17 +0000

Works great!

Your CSS calls could benefit from some leaner syntax, instead of a load of jQuery(this).css(“”,”") use object notation:

jQuery(this).css({
width: cellWidth + “em”,
height: cellHeight + “em”,
position: “absolute”
});

And consider wrapping all your code in an anonymous function so you can alias ‘$’ for jQuery safely: http://docs.jquery.com/Using_jQuery_with_Other_Libraries#Referencing_Magic_-_Shortcuts_for_jQuery

cheers!