kombai / freewall

Freewall is a cross-browser and responsive jQuery plugin to help you create grid, image and masonry layouts for desktop, mobile, and tablet...
MIT License
1.85k stars 375 forks source link

Wall does not refresh when I re-size block to smaller size with fixSize #124

Open SciGno opened 10 years ago

SciGno commented 10 years ago

Hello,

Thank you for such a great product!!! The best so far.

I use buttons to re-size the blocks. When I enlarge a block the wall refreshes properly but when I shrink a block, the rest of the blocks stay in their location and the wall does not refresh. Also, the onBlockResize event is not firing. Also, I'm running the latest code...

Thanks in advance for any help...

Here is my code:

$(function() {
        var wall = new freewall("#container");
        wall.reset({
            draggable: true,
            selector: '.item',
            animate: true,
            cellW: 250,
            cellH: 200,
            fixSize: 0,
            onResize: function() {
                wall.fitWidth();
            },
            onBlockResize: function(block, setting) {
                console.log('resize...');
            }
        });
        wall.fitWidth();

        $('.item').removeClass('fix');

        $('.glyphicon-th').click(function(){
            var $dna = $(this).closest('.item');
            var $obj = { block: $dna, width: 200, height: 200};
            wall.unFilter();
            wall.fixSize($obj);
            wall.refresh();
        });

        $('.glyphicon-th-large').click(function(){
            var $dna = $(this).closest('.item');
            var $obj = { block: $dna, width: 400, height: 650};
            wall.unFilter();
            wall.fixSize($obj);
            wall.refresh();
        });

        $('.glyphicon-fullscreen').click(function(){
            var $dna = $(this).closest('.item');
            var $obj = { block: $dna, width: 1200, height: 800};
            wall.unFilter();
            wall.fixSize($obj);
            wall.refresh();
        });

    });

This is the start:

image

After I enlarge:

image

After I shrink:

image

CntChen commented 9 years ago

I face a similar problem, I delete some block and leave holes. Method wall.fillHoles() is usefull for me. You can try this method.