Jquery MixItUp - Issue with hidden divs

Question

I'm having an issue with Jquery MixitUp and hidden divs. The idea is click one one button and show up one div with filters and thumbnails.

When i change the display of the main content, the mixitUp doesn't work. If i have the main content with display block, the script works well.

Here the both examples:

EDIT: http://jsfiddle.net/yrjsr6bp/ - Fiddle working http://jsfiddle.net/yrjsr6bp/1/ - Fiddle not working

<a onclick="$('#div5').show();" style='color:#000;'>SHOW THE DIV</a>

Thanks!

SOLUTION: I found the solution. The solutions is to run the script of mixitup in the same function where i change the display of the div. Thanks!

Answer 1

Update

You should initialize mixitup when the div is visible, you can easily do like so:

onclick="$('#div5').show(); $('#presscontainer').mixItUp();"

---

Better yet, abstract the javascript from the html:

HTML

<a id="showDivLink" style='color:#000;'>SHOW THE DIV</a>

JS

$(function () {
    $('#showDivLink').click(function (e) {
        $('#div5').show().promise().done(function () {
            $('#presscontainer').mixItUp();
        });
    });
});

FIDDLE