(function($){
$.fn.fill = function ( element ) {
    var i  = $('>', this),
        iw = i.width(),
        ih = i.height(),
        d  = $( element ),
        dw = d.width(),
        dh = d.height(),
        dy = Math.floor(dh/ih),
        lw = this.width(),
        lh = this.height(),
        lx = Math.floor(lw/iw),
        ly = Math.floor(lh/ih),
        h  = $('#header'),
        hx = Math.floor(h.width()/iw),
        hy = Math.floor(h.height()/ih),
        a  = lx * ly - hx * hy - i.length + (dy - ly) * lx,
        t  = ['graphisme','illustration','website','maquette'];
    for(var j = 1; j <= a; j++) {
        var p = Math.floor(Math.random() * i.length),
            c = t.sort(function(){return Math.round(Math.random()) - .5;})[0];
        i.eq(p).after($('<'+i[0].tagName+'/>').addClass(c + ' fill').text(c));
    }
    $('#page').css({'marginLeft':(dw-iw*lx)/2}); 
    return this;   
}
})(jQuery);
 jQuery(function($) {
        $(window).resize(function(){
            $( 'li.fill', '#content ul.grid' ).remove()
            .end().fill( document ).find( 'li' ).hover( 
            function(){ $(this).addClass('hover').css({opacity:1});},
            function(){ $(this).removeClass('hover').animate({opacity:.8});}
            ).css({opacity:.8});
        }).resize();
});