响应式设计：如何在移动端避免某些资源的加载？

Question

这段时间倒腾的东西需要和微博有大量的互动，所以使用了微博的展示框以及评论箱。微博在这方面处理的不是很好，均是提供了iframe的方式。在移动端我并不希望加载这样的iframe页面，@media+display:none无法避免资源被加载，只是被隐藏而已。不谈及性能，光在流量损耗上对于访问者来说都是不友好的。最终我想到一个办法来处理展示框，由于本身已经引用了JQuery，所以直接用了下面的代码：if($(window).width()>1260){$("#sidebar").html("");};查询窗体宽度后，填入iframe内容，可以避免手机端的加载。但是这样的办法无法应用于评论箱，不知道从何下手。微博提供的是这样的一段代码：(function(){varurl="//xxxxxxxxxxxxxx.com";url=url.replace("url=auto","url="+encodeURIComponent(document.URL));document.write('');})();window.WBComment.init({"id":"WBCommentFrame"});希望这段代码能够在1260以上的宽度才会被加载，而不是被隐藏。先行感谢！