ducksboard / gridster.js

gridster.js is a jQuery plugin that makes building intuitive draggable layouts from elements spanning multiple columns
http://gridster.net/
MIT License
6.04k stars 1.2k forks source link

When set rowHeight = 'auto' then all tiles overlap #507

Open ashanvabs opened 9 years ago

ashanvabs commented 9 years ago

What need is I want to specify the tile height of each tile or tile's hieght should increase when content are getting bigger.

dtamm commented 9 years ago

Exactly what i am searching for, just had the issue myself. The content is higher than the actual widget in the gridster, which is annoying, sind the widget overlaps the widgets under this one.

dtamm commented 9 years ago

I think i found myself a workaround (at least for the moment):

In Method "fn.generate_stylesheet = function(opts)" i extended the declaration of the CSS-markdown for "data-sizey" (in my code its around 3684) from this:

for (var y = 1; y <= opts.rows; y++) {
    styles += (opts.namespace + ' [data-sizey="' + y + '"] { height:' +
        (y * opts.widget_base_dimensions[1] +
        (y - 1) * (opts.widget_margins[1] * 2)) + 'px; }\n');
}

to this:

for (var y = 1; y <= opts.rows; y++) {
    styles += (opts.namespace + ' [data-sizey="' + y + '"] { height:' +
        (y * opts.widget_base_dimensions[1] +
        (y - 1) * (opts.widget_margins[1] * 2)) + 'px; }\n');
    styles += (opts.namespace + ' [data-sizey="' + y + '"] div.content { height:' +
        ((y * opts.widget_base_dimensions[1] +
        (y - 1) * (opts.widget_margins[1] * 2)) - 40) + 'px; }\n');
}

Every content inside my widgets will be rendered in a div with the classname "content". Thats how i got it working for now.