diff --git a/README.md b/README.md index 2ea97f4..4e046a2 100644 --- a/README.md +++ b/README.md @@ -67,6 +67,12 @@ 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. + +disableSingle + +Disables single column layout if number of columns is less or equal to 1. Useful to force columns scrolling horizontally on small screens. See demo 5 for an example.. Default is false. + + diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 6e94a29..0df4a09 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -53,6 +53,9 @@ precise : false, // don't automatically layout columns, only use manual columnbreak manualBreaks : false, + // disable single column layout when container width < columnWidth + // (useful for horizontally scrollable columns in mobile view) + disableSingle : false, // previx for all the CSS classes used by this plugin // default to empty string for backwards compatibility cssClassPrefix : "", @@ -471,7 +474,7 @@ // if ($inBox.data("columnized") && numCols == $inBox.children().length) { // return; // } - if(numCols <= 1){ + if(numCols <= 1 && ! options.disableSingle){ return singleColumnizeIt(); } if($inBox.data("columnizing")) return; diff --git a/src/jquery.columnizer.min.js b/src/jquery.columnizer.min.js index a4b6fa8..51f5aad 100644 --- a/src/jquery.columnizer.min.js +++ b/src/jquery.columnizer.min.js @@ -1,5 +1,5 @@ -(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} +(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,disableSingle:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} if(typeof options.setColumnStart=='function'){this.setColumnStart=options.setColumnStart;} if(typeof options.elipsisText=='string'){this.elipsisText=options.elipsisText;} if(options.debug){this.debug=options.debug;} @@ -42,7 +42,7 @@ function checkDontEndColumn(dom){if(dom.nodeType==3){if(/^\s+$/.test(dom.nodeVal return false;} if(dom.nodeType!=1)return false;if($(dom).hasClass(prefixTheClassName("dontend")))return true;if(dom.childNodes.length===0)return false;return checkDontEndColumn(dom.childNodes[dom.childNodes.length-1]);} function columnizeIt(){adjustment=0;if(lastWidth==$inBox.width())return;lastWidth=$inBox.width();var numCols=Math.round($inBox.width()/options.width);var optionWidth=options.width;var optionHeight=options.height;if(options.columns)numCols=options.columns;if(manualBreaks){numCols=$cache.find(prefixTheClassName("columnbreak",true)).length+1;optionWidth=false;} -if(numCols<=1){return singleColumnizeIt();} +if(numCols<=1&&!disableSingle){return singleColumnizeIt();} if($inBox.data("columnizing"))return;$inBox.data("columnized",true);$inBox.data("columnizing",true);$inBox.empty();$inBox.append($("
"));$col=$inBox.children(":last");appendSafe($col,$cache.clone());maxHeight=$col.height();$inBox.empty();var targetHeight=maxHeight/numCols;var firstTime=true;var maxLoops=3;var scrollHorizontally=false;if(options.overflow){maxLoops=1;targetHeight=options.overflow.height;}else if(optionHeight&&optionWidth){maxLoops=1;targetHeight=optionHeight;scrollHorizontally=true;} for(var loopCount=0;loopCount<20;loopCount++){$inBox.empty();var $destroyable,className,$col,$lastKid;try{$destroyable=$cache.clone(true);}catch(e){$destroyable=$cache.clone();} $destroyable.css("visibility","hidden");for(var i=0;i
"));} @@ -87,4 +87,4 @@ var $parents=this.before.parents();this.lastOther=0;var $found=false;for(;this.l this.nest=1;if($(this.cols[this.offset]).find(">"+$tag1+':first li '+$tag1+":first").length){this.nest=2;} this.setList(this.cols,$list,$tag1);this.lastOther--;$list=$(this.cols[this.offset]).find($tag1+':first li '+$tag1+":first");if($list.length){this.before=$(this.cols[this.offset-1]).find(">"+$tag1+':last li '+$tag1+":last");this.prevMax=0;this.nest=1;this.setList(this.cols,$list,$tag1);} var $reset=$(this.cols[this.offset-1]).find(">"+$tag1+':last');this.prevMax=$reset.children().length;}} -return 0;};})(jQuery); \ No newline at end of file +return 0;};})(jQuery);