ilość elementów zależne od szerokości okna Opcje

[shd]

Mam taki przypadek: wyświetlam na stronie kilka elementów, wypełniających jedną linię. Klikając button można załadować następną linię, i następną, i tak do wyświetlenia wszystkich elementów (ot, taki przykład load more jak w twitterze) - kod poniżej.
Szerokość elementów uzależniona jest od szerokości okna (media queries). Jednak przy mniejszych szerokościach w jednej linii mieści się mniej elementów, przez co niektóre przechodzą do następnej linii. Jak zrobić, aby można było uzależnić ilość elementów ładowanych przez skrypt w zależności od aktualnej szerokości okna (definicja vis = x)?

Kod

var vis = 5;
$('.mask').slice(vis).hide();
var $more = $('<a href="#" id="load">Zobacz więcej</a>')
    $more.click(function(e){
        e.preventDefault();
        $('.mask').removeClass('stoker');
        $('.mask:hidden').slice(0,vis).addClass('stoker').slideDown(500, function() {
                  $('html, body').animate({
                    scrollTop: $('.stoker').offset().top -55
                  });
            }
            );
        if($('.mask:hidden').length == 0)
            $more.hide();
    });
$('.folio').after($more);

[freemp3]

Sprawdzasz szerokość kontenera, do którego ładujesz elementy. Znając jego wielkość i wielkość elementu bez problemu policzysz ile się zmieści.

[shd]

Czy będzie to miało również zastosowanie gdy wielkość elementu będzie procentowa? Szerokość kontenera będzie zmienna, natomiast w pewnym zakresie szerokości (queries) szerokość elementu będzie stała. Czyli teoretycznie muszę sprawdzić dwie zmienne. Jakaś wskazówka jak to zrobić (tzn. jak ugryźć te dwie zmienne)?