added new grid plugin for adding classes to create flexible column layouts.

This commit is contained in:
scottjehl 2010-09-19 08:14:48 -04:00
parent 8f26170f6a
commit b500be9657
2 changed files with 29 additions and 0 deletions

28
js/jQuery.mobile.grid.js Normal file
View file

@ -0,0 +1,28 @@
/*
* jQuery Mobile Framework : plugin for creating grids
* Copyright (c) jQuery Project
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
* Note: Code is in draft form and is subject to change
*/
(function($){
$.fn.grid = function(options){
return $(this).each(function(){
var o = $.extend({
grid: 'a'
},options);
$(this).addClass('ui-grid-' + o.grid);
var $kids = $(this).children();
iterator = o.grid == 'a' ? 2 : 3;
$kids.filter(':nth-child(' + iterator + 'n+1)').addClass('ui-block-a');
$kids.filter(':nth-child(' + iterator + 'n+2)').addClass('ui-block-b');
if(iterator == 3){
$kids.filter(':nth-child(3n+3)').addClass('ui-block-c');
}
});
};
})(jQuery);

View file

@ -18,6 +18,7 @@ $elements = array(
'jQuery.mobile.listview.js',
'jQuery.mobile.dialog.js',
'jQuery.mobile.globalnav.js',
'jQuery.mobile.grid.js',
'jQuery.mobile.js'
);