Implementing fluid JS tile interface

If I were you I would use Isotope for the basic layout and add the slide shows and click events along side it. You can insert most any content you like. jQuery Isotope.

Updated Working Model

Full page result

JS

$(function () {

    var $container = $('#container');

    $container.imagesLoaded(function () {
        $container.isotope({
            itemSelector: '.photo'
        });
    });
});


var $container = $('#container');
// initialize Isotope
$container.isotope({
    // options...
    resizable: false, // disable normal resizing
    // set columnWidth to a percentage of container width
    masonry: {
        columnWidth: $container.width() / 5
    }
});

// update columnWidth on window resize
$(window).smartresize(function () {
    $container.isotope({
        // update columnWidth to a percentage of container width
        masonry: {
            columnWidth: $container.width() / 5
        }
    });
});

//click function

    $(function () {
        $('.photo').click(function () {
            $(this).toggleClass('red');
        });
    });

//hover function

    $(function () {
        $('#photo1').hover(function () {
            $('#info1').fadeToggle();
        });
    });

Proof of concept- Animations inside Isotope

Note this animation is total kludge fine tune before using.

 function animatie() {
     var d = 0;
     for (var i = 0; i < 3; ++i) {
         var b = "#info" + i;
         $(b).css('background', 'silver');
         $(b).hide().delay(d).slideDown(1000).delay(3000).slideUp(1000);
         d += 5000;
     }
 }
 animatie();
 window.setInterval(animatie, 15000);

 $(function () {
     for (var i = 0; i < 3; ++i) {
         var z = '.box' + i;
         var divHeight = $(z).height();
         $(z).css('max-height', divHeight + 'px');
         $(z).css('max-height', divHeight + 'px');
         $(z).css('overflow', 'hidden');
     }
 });
 $(window).resize(function () {
     for (var i = 0; i < 3; ++i) {
         var z = '.box' + i;
         var divHeight = $(z).height();
         $(z).css('max-height', divHeight + 'px');
         $(z).css('overflow', 'hidden');
     }
 });

This is a very cool plugin for layout, sorting, and filtering. It will give you the tiles and animations as basic features.

Fluid Isotope

Images Loaded Plugin

Infinite Scroll

Added animation inside Isotope, Check Out the updated jsFiddles above