<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<style>

    .banner{

    width:100%;

    background:url(../images/music_banner.jpg) no-repeat center;

    height:560px;

}

</style>

<body>

    <div class="banner" id="banner">

</body>

<script src="static/js/jquery.min.js"></script>

<script type="text/javascript">

        $(function () {

        var w=$(window).width();

         alert(w);

         if(w>1200 && w<1400)//1366分辨率下

        {

        $("#banner").css("background", "url(static/images/music_banner-1366.jpg) no-repeat center");

        $("#banner").css("height", "397px");

        $('#navbar-menu li').hover(function(){

           $('body').css({

             "overflow-x":"hidden",

             "overflow-y":"hidden"

         });

        })

        }else if(w>1401 && w<1700)//1440 及 1680分辨率下

        {

         $("#banner").css("background", "url(static/images/music_banner-1440.jpg) no-repeat center");

         $("#banner").css("height", "420px");//1440尺寸图片的高度

        }

     });

    </script>

</html>

JQ判断在不同分辨率电脑下使用不同的banner尺寸的更多相关文章

  1. jq判断滚动条向上还是向下

    $(document).ready(function(){ ,t=; $(window).scroll(function(e){ p = $(this).scrollTop(); if(t<=p ...

  2. js判断是手机还是电脑访问网站

    js判断是手机还是电脑访问网站                               <script type="text/javascript"> <!- ...

  3. JavaScript判断鼠标滑轮是向下还是向上滚动

    我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好. 当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件. 使用JavaSc ...

  4. jq 判断输入数字

    jq 判断输入数字 <input   id="N_source" name="N_source"   type="text" valu ...

  5. vc 判断哪个按键 被按下 消息 按键 状态

    测试Numlock 是否是亮的 环境控制台程序: #include "stdafx.h" #include <stdio.h> #include <conio.h ...

  6. 滚动条大于120px时，判断pc端的情况下，导航条固定定位

      //滚动条大于120px时,判断pc端的情况下,导航条固定定位 $(window).scroll(function(){ var viewWidth=$(document).width() var ...

  7. Android手机在不同分辨率情况下字体自适应大小

    两种解决方法: 一. 1.首先根据不同分辨率获取不同字体大小. 在RES里创建values-480x320/strings.xml 里面设置<dimen name="Text_size ...

  8. mac 电脑下添加 HTMLtestrunner.py 生成 报表

    HTMLTestRunner是Python标准库unittest模块的一个扩展.它生成易于使用的HTML测试报告. 1.下载HTMLTestRunner.py模块地址 http://tungwaiyi ...

  9. Mac电脑下配置maven环境变量

    Mac电脑下配置maven环境变量 打开终端,使用 touch 命令创建 .bash_profile 文件 touch .bash_profile 编辑刚刚创建的文件 .bash_profile vi ...

随机推荐

  1. 转://Oracle not in查不到应有的结果(NULL、IN、EXISTS详解)

    问题: 语句1 : Select   *   from   table1 A  where  A.col1  not   in  (  select  col1  from  table2 B )  ...

  2. 【css】3d导航效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Quartz动态添加定时任务执行sql（服务启动添加+手动添加）

    系统用来每天插入视图数据... 一.数据库表设计 1.接口配置表(t_m_db_interface_config) 2.接口日志表(t_m_db_interface_log) 3.前端配置页面 查询页 ...

  4. nginx+tomcat9+redisson+redis+jdk1.8简单实现session共享

    一.环境安装 由于资源限制,在虚拟机中模拟测试,一台虚拟机,所有软件均安装到该虚拟机内 安装系统:CentOS Linux release 7.4.1708 (Core) CentOS安装选择版本:B ...

  5. DES对称加密算法详解和c++代码实现（带样例和详细的中间数据）

    特点: 1.DES是对称性加密算法,即加密和解密是对称的,用的是同一个密钥 2.DES只处理二进制数据,所以需要将明文转换成为2进制数据 3.DES每次处理64位的数据,所以应该将明文切割成64位的分 ...

  6. 用ASP.NET MVC仿站糗事百科

    废话就不多说,直接来操作,有些细节问题就不一一解说了(没有几天几夜都说不完),主意是想让大家看完知道大概这个框架是怎么搭建的就可以了 一. 新建一个解决方案,搭建三层架构,分别为: DAL层  .DL ...

  7. JavaScript技巧总结和本地存储(二)

    离线检测 检测是否离线,html5为此定义了一个navigator.onLine属性,这个属性为true表示设备能上网,false表示离线,这个属性还有点兼容问题.因此单独使用这个属性不能确定网络是否 ...

  8. JS判断当前设备是 PC IOS Andriod

    JS判断当前设备是 PC IOS Andriod <script > window.onload = function(){ var isPc = IsPC(); var isAndroi ...

  9. [Linux]Debian 9重启DNS重置问题

    先编辑/etc/resolv.conf, 添加一个DNS, 比如114.114.114.114 然后sudo apt-get install resolvconf 然后编辑/etc/resolvcon ...

  10. vue2.0之axios使用详解

    axios 基于 Promise 的 HTTP 请求客户端,可同时在浏览器和 node.js 中使用 功能特性 在浏览器中发送 XMLHttpRequests 请求 在 node.js 中发送 htt ...