flexslider behaviour issue inside accordion

Question

I have a test page to better explain my problem. I have several items on a list (they\'re images on the test page); when I click on one of them, a corresponding slideshow, usin

Answer 1

I think I've figured it out, in principal at least...

.flexslider{display:none;} seems throw off the re-size function of Flexslider. You could just remove it, but that makes for some ugly loading.

To avoid said ugly loading I put together a quick, work-around- jsFiddle

$(document).ready(function(){
    $(".flexslider").css('display','block').slideUp();
});

There's a still a quick glitch while loading, but hopefully it will at least steer you in the right direction.

---

Another method I played with a bit was to try and force the re-size function like so-

$(".client").click(function () {
    $('.flexslider').resize();    // Problematic but promising
    var project = this.id;
    var project_id = '#' + project + '-project';
    var elem = $(".flexslider:visible").length ? $(".flexslider:visible"): $(".flexslider:first");
    elem.slideUp('slow', function () {
        $(project_id).slideDown('slow');
    });
});

This sort of solved the mini-picture issue, but was spotty at best.