Stop a Jquery function on a specific window size

Stop a Jquery function on a specific window size

I have a function on Jquery, that when the user scrolls down, the animates
becoming smaller. But I want that function to stop working when the window
size is lower than 1024px...
I mean, when the the window size is lower than 1024px, the wont animate,
it will stay the same size always. So this function will work only if the
window size is bigger than 1024px.
Here is the code...
$(function(){
$('header').data('size','big');
});
$(window).scroll(function(){
if($(document).scrollTop() > 30)
{
if($('header').data('size') == 'big')
{
$('header').data('size','small');
$('header').stop().animate({"height":"60px"}, 200,
'easeOutQuad');
$('nav ul').stop().animate({"padding-top":"0",
"margin":"0.84em 0"}, 200);
$('#logo').stop().animate({"padding-top":"0.5em",
"padding-bottom":"0.6em"}, 200);
$('#logo img').stop().animate({"width":"170px",
"height":"40px"}, 200);
}
}
else
{
if($('header').data('size') == 'small')
{
$('header').data('size','big');
$('header').stop().animate({"height":"92px"}, 200,
'easeOutQuad');
$('nav ul').stop().animate({"padding-top":"0.68em",
"padding-bottom":"0.77em", "margin":"1em 0"}, 200);
$('#logo').stop().animate({"padding-top":"1em",
"padding-bottom":"1.35em"}, 200);
$('#logo img').stop().animate({"width":"215px",
"height":"50px"}, 200);
}
}
});
How can I make that happen?...