Use Strict with Isotope Issue?

3 Views

I have a custom js file, with a function for Isotope inside it. All is fine, until I declare Use Strict at the top, then I get an error –

In strict mode code, functions can only be declared at top level or immediately within another function.

Read More

I have the following Isotope code, but unsure how I should adjust this for compliance? 

if ($('.full-width').length) {

    function portfolioColumn() {
        var width = $(window).width(),
            column;

        if (width > 1400) {
            column = 4;
        } else if (width > 1000) {
            column = 3;
        } else if (width > 550) {
            column = 2;
        } else if (width > 0) {
            column = 1;
        }

        return column;
    }

    function setColumn() {
        if (!$('.portfolio-items').length) return false

        var width = $(window).width(),
            column = portfolioColumn(),
            articleWidth = Math.floor(width / column);

        $('.portfolio-items .project-item').each(function () {
            $(this).css({
                width: articleWidth + 'px'
            });
        });
    }

    setColumn();
    $(window).bind('resize', function () {
        setColumn();
    });
};

$(window).load(function () {
    var $container = $('.portfolio-items');
    var $filter = $('.filter');
    // Initialize isotope 
    $container.isotope({
        filter: '*',
        layoutMode: 'fitRows',
        animationOptions: {
            duration: 750,
            easing: 'linear'
        }
    });
    // Filter items when filter link is clicked
    $filter.find('a').click(function () {
        var selector = $(this).attr('data-filter');
        $filter.find('a').removeClass('current');
        $(this).addClass('current');
        $container.isotope({
            filter: selector,
            animationOptions: {
                animationDuration: 750,
                easing: 'linear',
                queue: false,
            }
        });
        return false;
    });
});

Many thanks

Post Views: 3

Related posts

Leave a Reply

1 comment

  1. You cannot make a function declaration within an if statement.

    This is a restriction, because wheter it is declared in the if or not, the function is scoped to the top and usable.

    Basically, you cannot do conditionnal function declaration (it simply doesn’t work this way in JavaScript). To fix it, assign a function to a variable instead.

    var portfolioColumn;

if ($('.full-width').length) {

    portfolioColumn = function () { /* etc */ };

}