Max height and width with jquery resize

I'm using the jquery resize to resize content on my webpage. It works, but I want that when the element reaches the desired height or width, it should stop resizing, how do I achieve this?

Here's the code:

$(window).resize(function(){
    $(map).height(win.height() - 210);

    if($(window).height() == 300){
        $(map).css({
                    "height": "250px"
                    });
    }
});

I did an if statement but it still doesn't work, what's wrong with the code. Please advise me on this?

Thanks in advance.

Set the maxHeight of the resizable div

$(document).ready(function(){
    $("#map").resizable({
      maxHeight: 300
    });
});

And then set the corresponding div to have a scroll bar on overflow

#map{
  overflow:scroll;
}

This would allow the div to always have a scroll bar and limit the user when resizing the corresponding div

source: jQuery resizable API (max/min)

You're saying if it = 300. Tthat is very specific, I would use >= 300