Поставил скрипт, показать еще блоки, показывает 3 блока, кликаем, показывает еще 3, при адаптации экрана, я делаю в ряд 2 блока, а третий выходит что один, не совсем красиво, как js доработать, чтобы при определенном размере экрана, у меня показывалось не 3 блока, а 4.

По дефолту стоит показывать 3 блока в ряд, при адаптации, срабатывает у стилей @media only screen and (max-width:950px) , и в ряд уже 2 блока, но скрипт показать еще показывает 3, как чтобы при этом разрешении и скрипт менял количество показывать 3 на 4.


Выглядит это так:



Рабочий пример добавил сюда:
http://jsfiddle.net/vlit/m72w5uob/212/

Скрипт показывать еще:
<script>
$(document).ready(function() {
var list = $(".pokazbl .twentytwenty");
var numToShow = 3; //сколько показывать элементов
var button = $(".pokazbl a.pokobt");
var numInList = list.length;
list.hide();
if (numInList > numToShow) {
button.show();
}
list.slice(0, numToShow).show();
button.click(function() {
var showing = list.filter(':visible').length;
list.slice(showing - 1, showing + numToShow).fadeIn();
var nowShowing = list.filter(':visible').length;
if (nowShowing >= numInList) {
button.hide();
}
initTwenty();
});
});
</script>