Stop jQuery anitmation with media query -

hello guys have simple jquery animation

    $(window).load(function() {          //top header logo expand $("#logo-expand").mouseenter(function() {     $(this).animate({         width: "170px"     }, 300 ); });  $("#logo-expand").mouseleave(function() {     $(this).animate({         width: "56px"     }, 300 ); });      });  

now want disable animation when in phone resolution, how can jquery media queries, idea?

here's http://jsfiddle.net/myknb/5/

thank in advance

you can use window.innerwidth determine width of screen , perform animation if greater width

$(window).load(function() { if (window.innerwidth > 700){     //top header logo expand $("#logo-expand").mouseenter(function() { $(this).animate({     width: "170px" }, 300 ); });  $("#logo-expand").mouseleave(function() { $(this).animate({     width: "56px" }, 300 ); } });  });