合并jquery脚本和媒体查询

Question

对不起我的问题的基本性质。我的网站上有一些jquery代码，它在右上角加载了一个'peelback'广告。这个网站已经针对移动屏幕进行了优化，我想禁用这个脚本加载到宽度小于640px的屏幕上，因为它与我所拥有的移动导航相关。

我收到了一些反馈，建议可以使用媒体查询来实现此目的。我已经找到了一些代码（下面），我希望将其与现有的jquery结合使用，但我很难过如何做到这一点。

我已经研究了很多年，并试验到了疲惫的程度！如果有人能告诉我如何将这个媒体查询与我现有的jquery代码结合起来，那将有助于我的jquery教育永无止境！

媒体查询脚本：

$(window).resize(function(){
if ($(window).width() <= 800){  
    // do something here
}   
});

我在我的网站上加载的剥离广告（顺便说一句，它的效果非常好！）：

<script>

(function($) {
$.Peelback = function(el, settings) {

//Caching
var base = this;
base.$el = $(el);
base.el = el;
base.$el.data("Peelback", base);

//Main stuff    
base.init = function() {

  //Vars
  var peelHTML, peelImage, peelMask, smallSize, bigSize, smallMaskSize, bigMaskSize;

  //Defaults, meet Settings
  base.settings = $.extend({},$.Peelback.defaultSettings, settings);      

  //If ad image is missing, stop the show            
  if (typeof(base.settings.adImage) !== 'string' || base.settings.adImage === '') {
    if ( base.settings.debug === true) {
      console.log('Ad image missing');
    }
    return;
  }

  //If peel image is missing, stop the show            
  if (typeof(base.settings.peelImage) !== 'string' || base.settings.peelImage === '') {
    if ( base.settings.debug === true) {
      console.log('Peel effect image missing');              
    }
    return;
  }

  //If click URL is missing, stop the show            
  if (typeof(base.settings.clickURL) !== 'string' || base.settings.clickURL === '') {
    if ( base.settings.debug === true) {
      console.log('Click URL missing');              
    }
    return;
  }

  //Convenience vars and set mask size
  smallSize = base.settings.smallSize + 'px';
  bigSize = base.settings.bigSize + 'px';
  smallMaskSize = (base.settings.smallSize - 3) + 'px';
  bigMaskSize = Math.floor((base.settings.bigSize * 0.96)) + 'px';

  //Assemble
  peelHTML = $('<div id="peelback"><a href="' + base.settings.clickURL + '" target="_self"><img src="' + base.settings.peelImage +'" alt="" border="0" /></a><div></div></div>');
  peelImage = peelHTML.find('img');
  peelMask = peelHTML.find('div');

  $(peelImage).css({
    'width': '0',
    'height': '0',
    'z-index': '199',
    'position': 'absolute',
    'right': '0',
    'top': '0',
    '-ms-interpolation-mode': 'bicubic'
  });

  $(peelMask).css({
    'width': '0',
    'height': '0',
    'z-index': '99',
    'overflow': 'hidden',
    'position': 'absolute',
    'right': '0',
    'top': '0',
    'background': 'url(' + base.settings.adImage + ') no-repeat right top'
  });

  //Insert
  base.$el.prepend(peelHTML);

  //Auto animate option      
  if (base.settings.autoAnimate === false) {
    $(peelImage).css({ 'width' : smallSize, 'height' : smallSize });
    $(peelMask).css({ 'width' : smallMaskSize, 'height' : smallMaskSize });
  } else {
    $(peelImage).delay(500).animate({
      width: smallSize, 
      height: smallSize
    }, 500);

    $(peelMask).delay(500).animate({
      width: smallMaskSize, 
      height: smallMaskSize
    }, 500); 
  }      

  //Hover behavior
  peelHTML.hover(

    //Mouseover
    function() {      
      $(peelImage).stop().animate({
        width: bigSize, 
        height: bigSize
      }, 500);

      $(peelMask).stop().animate({
        width: bigMaskSize, 
        height: bigMaskSize
      }, 500);

      //If GA tracking enabled
      if (base.settings.gaTrack === true) {    
        if (typeof(_gaq) != 'undefined') {
          _gaq.push(['_trackEvent', 'Ad_Interaction', 'Peelback',        base.settings.gaLabel]);
        } else {
          if (base.settings.debug === true) {
            console.log('Google Analytics _gaq object undefined');
          }
        }  
     }   
    },

    //Mouseout
    function() {
      $(peelImage).stop().animate({
        width: smallSize,
        height: smallSize
      }, 400);

      $(peelMask).stop().animate({
        width: smallMaskSize,
        height: smallMaskSize
      }, 400);
    }

  );

};

// Run initializer
base.init();
};

$.Peelback.defaultSettings = {
adImage     : null,
peelImage   : null,
clickURL    : null,
smallSize   : 58,
bigSize     : 510,
gaTrack     : false,
gaLabel     : 'default',
autoAnimate : true,
debug       : false
};

$.fn.peelback = function(settings) {
return this.each(function() {
  (new $.Peelback(this, settings));
});
};

})(jQuery);

</script>  

<script>

   $(function(){
$('body').peelback({
adImage     : 'http://peelad.png',
peelImage   : 'http://page_peel.png',
clickURL    : 'http://advertpage.com/',
smallSize   : 70,
bigSize     : 300,
gaTrack     : true,
gaLabel     : '#1 Stegosaurus',
autoAnimate : true,
debug       : false 

});
});

</script>

感谢任何建议！提前谢谢。

亚历