diff --git a/README.md b/README.md index 46a5628..5a4d25e 100644 --- a/README.md +++ b/README.md @@ -67,6 +67,14 @@ Columnizer will add CSS classes to the columns it creates. Each column will have manualBreaks Defaults to false. Set to true if you only want to create columns with manual column breaks. If true, then width, height, columns options are ignored. + +columnClassFunc +Optional function that will be called for each column to generate custom class selectors for sizing instead of inline width.
Eg: columnClassFunc: function(col) { return "grid-" + (12/col); } + + +extraColumnClass +Extra classes to add to each column. + diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 018bb2d..ea1eec6 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -1,4 +1,4 @@ -// version 1.6.0 +// version 1.6.1 // http://welcome.totheinter.net/columnizer-jquery-plugin/ // created by: Adam Wulf @adamwulf, adam.wulf@gmail.com @@ -38,7 +38,11 @@ manualBreaks : false, // previx for all the CSS classes used by this plugin // default to empty string for backwards compatibility - cssClassPrefix : "" + cssClassPrefix : "", + // if set use columnClassFunc(colNum) to set width's with custom classes instead of fixed percentiles + columnClassFunc: false, + // extra classes to add to each column wrapper + extraColumnClass: false }; options = $.extend(defaults, options); @@ -301,6 +305,7 @@ + prefixTheClassName("first") + " " + prefixTheClassName("last") + " " + prefixTheClassName("column") + " " + + options.extraColumnClass + " " + "' style='width:100%; float: " + options.columnFloat + ";'>")); //" $col = $inBox.children().eq($inBox.children().length-1); $destroyable = $cache.clone(true); @@ -396,9 +401,12 @@ if($inBox.data("columnizing")) return; $inBox.data("columnized", true); $inBox.data("columnizing", true); + + var targetWidth = !options.columnClassFunc ? "width:" + (Math.floor(100 / numCols))+ "%; " : ""; + var targetClass = options.columnClassFunc ? options.columnClassFunc(numCols) : ""; $inBox.empty(); - $inBox.append($("
")); //" + $inBox.append($("
")); $col = $inBox.children(":last"); $col.append($cache.clone()); maxHeight = $col.height(); @@ -441,7 +449,9 @@ className = (i === 0) ? prefixTheClassName("first") : ""; className += " " + prefixTheClassName("column"); className = (i == numCols - 1) ? (prefixTheClassName("last") + " " + className) : className; - $inBox.append($("
")); //" + className += options.extraColumnClass ? " " + options.extraColumnClass : ""; + className += options.columnClassFunc ? " " + targetClass : ""; + $inBox.append($("
")); } // fill all but the last column (unless overflowing) @@ -449,7 +459,7 @@ while(i < numCols - (options.overflow ? 0 : 1) || scrollHorizontally && $destroyable.contents().length){ if($inBox.children().length <= i){ // we ran out of columns, make another - $inBox.append($("
")); //" + $inBox.append($("
")); } $col = $inBox.children().eq(i); if(scrollHorizontally){