Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Window Resize set heigth new? #45

Open
Messa1 opened this issue Sep 29, 2014 · 2 comments
Open

Window Resize set heigth new? #45

Messa1 opened this issue Sep 29, 2014 · 2 comments

Comments

@Messa1
Copy link

Messa1 commented Sep 29, 2014

Is it possible to set the targetheight new after resize of the window?
I try this.

  // All images need to be loaded for this plugin to work so
    // we end up waiting for the whole window to load in this example
    $(window).load(function () {
        $(document).ready(function(){

        collage();


        });
    });     

    var size = "150"

    // Here we apply the actual CollagePlus plugin

    function checkWidth() {
            var windowSize = $(window).width();

            if (windowSize < 480) {
                var size = "120";
            }
            else if (windowSize < 720) {
                var size = "120";
            }
            else if (windowSize < 1160 ) {
                var size = "120";
            }
            else {
                var size = "150";
            }
            console.log(size);
        };

        // Execute on load
        checkWidth();
        // Bind event listener
        $(window).resize(checkWidth);   

        $(window).resize(collage);   


    function collage() {
        $('.Collage').removeWhitespace().collagePlus(
            {
                'fadeSpeed'     : 'fast',
                'targetHeight'  : size,
                'direction'     : 'vertical'
            }
        );
    };
@haheute
Copy link

haheute commented Sep 29, 2014

this: setTimeout(collage, 50);should already start collage(). perhaps it doesn't work because you have collage() twice. try to remove the collage() after console.log(size). I don't know, perhaps it is necessary to pass size to the collage() function and then use the variable in the collage() function for setting the height. something like collage(size). (?)

ps: and then, also use it in the function, something like:

function collage(size) { ..

@haheute
Copy link

haheute commented Sep 29, 2014

seems to work like this

function collage(size){
    console.log(size);
    $('.Collage').removeWhitespace().collagePlus({
        'targetHeight': size,
        'allowPartialLastRow' : true
    });
};

// This is just for the case that the browser window is resized
var resizeTimer = null;
var windowSize = $(window).width();
$(window).bind('resize', function() {
    if($(window).width() != windowSize){
            if (windowSize < 1160 ) {
                var size = 120;
            }
            else {
                var size = 250;
            }
    //console.log(size);

    if (resizeTimer) clearTimeout(resizeTimer);
    resizeTimer = setTimeout(collage(size), 250);
    windowSize = $(window).width();
    }
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants