resize function with window width jQuery

Question

  if ($(window).width() >= 320 && $(window).width() <= 480) {
    $(".projects").slice(1, 8).css("margin", "10px");
  } else {
    $(".projects").slice(3, 6).css("margin", "10px");
  };

Its working good with default without resize finction. I try set this with:

 $(window).resize(function() {           
 })

But not working. Any idea why?

JSFIDDLE

Answer 1

You are never resetting the div margins. Therefore, as soon as it get to the point where slice 1 through 8 have margins, they will never get changed back. You need to reset the divs:

$(window).resize(function () {
    $(".projects").css('margin', '0px'); // reset the divs
    if ($(window).width() >= 320 && $(window).width() <= 480) {
        $(".projects").slice(1, 8).css("margin", "10px");
    } else {
        $(".projects").slice(3, 6).css("margin", "10px");
    };
});

Here is Fiddle