9

I'm trying to find a way to auto-resize gridster container.

In a way that when user changes browser size, corresponding gridster widgets resized. (In which number of columns and rows does not change, but actual size will)

I can calculate the values for "widget_base_dimensions" as browser size changes,

however I couldn't find a way to update/execute to widgets to cope with new size.

I was seeking if there is a function that supports this kind of feature and I noticed that

on line 3529 on jquery.gridster.js, 

/**
* Recalculates the offsets for the faux grid. You need to use it when
* the browser is resized.
*
* @method recalculate_faux_grid
* @return {Object} Returns the instance of the Gridster class.
*/
fn.recalculate_faux_grid = function() {
    var aw = this.$wrapper.width();
    this.baseX = ($(window).width() - aw) / 2;
    this.baseY = this.$wrapper.offset().top;

    $.each(this.faux_grid, $.proxy(function(i, coords) {
        this.faux_grid[i] = coords.update({
            left: this.baseX + (coords.data.col -1) * this.min_widget_width,
            top: this.baseY + (coords.data.row -1) * this.min_widget_height
        });

    }, this));

    return this;
};

I tried to some how utilize them but failed :(

If anyone have been successfully utilized this code or work around, can you please help me?

ROMANIA_engineer
  • 54,432
  • 29
  • 203
  • 199
user2205425
  • 117
  • 1
  • 1
  • 10
  • have you had any luck with this? – Cole Dec 03 '13 at 20:51
  • Should define manuel width over the base dimension `.gridster li{width:34%;}` percentage would make it fit to screen – Harish Boke Mar 04 '14 at 09:30
  • better use Packery.js, gridster seems to be unsupported anymore – Denis Jul 03 '15 at 22:38
  • Did you have any luck with this? I recently came across the container width problem, and spotted that same function in the Gridster source, but having no joy in using it... I raised an issue on GitHub, but got nowhere yet... https://github.com/ducksboard/gridster.js/issues/525 – WastedSpace Aug 06 '15 at 10:18

1 Answers1

2

There's long standing issue #5 on project's issue tracket at Github, titled Auto refresh - Responsive grid and several others closed as duplicates. There you will find code posted by people trying to add responsiveness to gridster.

Piotr Dobrogost
  • 41,292
  • 40
  • 236
  • 366