$(window).on('load', function () {
$(window).trigger('resize');
}); $(function () {
  var $window = $(window),
  isLoaded = false;   function resizeBg() {
    var winWidth = $window.width(),
      winHeight = $window.height(),
      viewportAspectRatio = winWidth / winHeight;     $('.full-bg').each(function (index, item) {
      var $bg = $(item),
      bgWidth = $bg.width(),
      bgHeight = $bg.height(),
      aspectRatio = bgWidth / bgHeight;         if (viewportAspectRatio < aspectRatio ) {
          $bg.removeClass('full-width')
            .addClass('full-height')
            .css({
               top: 0,
               left: -(winHeight * aspectRatio - winWidth) / 2
             });
        } else {
          $bg.removeClass('full-height')
            .addClass('full-width')
            .css({
              top: -(winWidth / aspectRatio - winHeight) / 2,
              left: 0
            });
        }
    });
  }
  $window.on('resize', resizeBg);   $('.full-bg').on('load', function () {
    $(window).trigger('resize');
  });
}); enquire.register('screen and (max-width: 760px)', {
  match: function () {
    $('.responsive-img').each(function () {
      var $img = $(this),
        src = $img.data('mobile-src');
      if (src) {
        $img.attr('src', src).show();
      } else {
        $img.hide();
      }
    });
  },
  unmatch: function () {
    $('.responsive-img').each(function () {
      var $img = $(this),
        src = $img.data('src');
      if (src) {
        $img.attr('src', src).show();
      } else {
        $img.hide();
      }
    });
  }
}); enquire.register('screen and (min-width: 761px)', {
  match: function () {
    $('.responsive-img').each(function () {
      var $img = $(this),
        src = $img.data('src');
      if (src) {
        $img.attr('src', src).show();
      } else {
        $img.hide();
      }
    });
  },
  unmatch: function () {
    $('.responsive-img').each(function () {
      var $img = $(this),
        src = $img.data('mobile-src');
      if (src) {
        $img.attr('src', src).show();
      } else {
        $img.hide();
      }
    });
  }
});

full-background.js的更多相关文章

  1. chrome插件background.js 和 popup.js 交互

    要实现background.js 和 popup.js 之间的交互,首先需要先配置好 manifest.json文件,如: "background":{ //"page& ...

  2. metamask源码学习-background.js

    这个就是浏览器后台所进行操作的地方了,它就是页面也区块链进行交互的中间部分. metamask-background描述了为web扩展单例的文件app/scripts/background.js.该上 ...

  3. Node.js异步处理CPU密集型任务

    Node.js异步处理CPU密集型任务 Node.js擅长数据密集型实时(data-intensive real-time)交互的应用场景.然而数据密集型实时应用程序并非仅仅有I/O密集型任务,当碰到 ...

  4. 转:Node.js异步处理CPU密集型任务的新思路

    原文来自于:http://www.infoq.com/cn/articles/new-idea-of-nodejs-asynchronous-processing-tasks?utm_source=i ...

  5. vue的测试(Vue.js devtool)

    1. 安装chrome插件:Vue.js devtools(https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejigli ...

  6. vue-devtools(vue 2.0)手动安装与使用 ? 如何处理Vue.js is detected on this page ?

    vue-devtools手动安装与使用   一.在github上下载压缩包,github下载地址:https://github.com/vuejs/vue-devtools 二.解压到本地的某盘 三. ...

  7. 【转】利用 three.js 开发微信小游戏的尝试

    前言 这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各 ...

  8. Chrome插件开发,美化网页上的文件列表。chrome-extension,background

    上一篇文章 通过“content-scripts”的方式向页面注入js和css来美化页面,但是有一个弊端:一旦配置好需要注入的页面,之后如果这个页面地址以后发生变化,或者要新加一些URL进来,那么得修 ...

  9. metamask源码学习-ui/index.js

    The UI-即上图左下角metamask-ui部分,即其图形化界面 The MetaMask UI is essentially just a website that can be configu ...

  10. js:浏览器插件

    1.chrome background.js //chrome.webRequest.onBeforeRequest.addListener(function(info) { // chrome.ta ...

随机推荐

  1. ECSHOP商城全站自定义TITLE标题设置

    对于SEO来说,能让标题自定义的将会大大增加SEO效果,提高独立商城的流量,今天小编就收集从网上弄来ecshop全站自定义代码,很全哦! 1.Ecshop商品分类页如何实现自定义Title 最近发现很 ...

  2. Angular2 和TypeScript

    Angular2 和TypeScript 原文链接:https://www.infoq.com/articles/Angular2-TypeScript-High-Level-Overview 作者: ...

  3. jdk1.7 JDBC连接SQL Server2008

    路由器网:http://www.ming4.com/news/2355.html Jackie的博客:http://blog.163.com/jackie_howe/blog/static/19949 ...

  4. web后台获取不到session中的值(loading sessions from persistent storage),后改用JS传值

    线上的程序似乎从session中取不到domain数据,重启了一下tomcat查看log日志发现,居然有报错.错误信息如下 22-Sep-2016 00:52:16.562 SEVERE [local ...

  5. 简单的使用php多线程抓取网页

    PHP 利用 Curl Functions 可以完成各种传送文件操作,比如模拟浏览器发送GET,POST请求等等,受限于php语言本身不支持多线程,所以开发爬虫程序效率并不高,这时候往往需 要借助Cu ...

  6. yii CMenu的配置(导航栏)

    给主键的li 和a标签添加元素$this->myMenu = array( 'id'=>'myMenu', 'items'=>array( array( 'label'=>'H ...

  7. 使用ownCloud搭建你的个人云服务(ubuntu 14.04 server)(ownCloud对文件不切片,Seafile对文件切片),owncloud没有存储的功能 只能同步 本地删除了服务器也会删除

    ownCloud是什么 ownCloud是一个自由且开源的个人云存储解决方案(类似百度网盘或者Dropbox),包括两个部分:服务器和客户端. ownCloud在客户端可通过网页界面,或者安装专用的客 ...

  8. unix c 10

    网络常识:    OSI 7层模型  TCP模型    IP和端口    IP是用来定位网络中的计算机,端口用来代表 计算机中的某个进程.    IP 有点分十进制 和 十六进制的两种表示方式,底层 ...

  9. UI设计(流程/界面)设计规范

    1.UI设计基本概念与流程 1.1 目的 规范公司UI设计流程,使UI设计师参与到产品设计整个环节中来,对产品的易用性进行全流程负责,使UI设计的流程规范化,保证UI设计流程的可操作性. 1.2范围  ...

  10. Codeforces243C-Colorado Potato Beetle(离散化+bfs)

    Old MacDonald has a farm and a large potato field, (1010 + 1) × (1010 + 1) square meters in size. Th ...