<!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. day2 编程语言介绍、Python运行程序的两种方式、变量

    一 编程语言介绍 1. 机器语言 用计算机能理解的二进制指令直接编写程序,直接控制硬件 2. 汇编语言 用英文标签取代二进制指令编写程序,本质也是直接控制硬件 3. 高级语言 用人能理解的表达方式去编 ...

  2. 003_生成器(generator)内部解析

    #http://kb.cnblogs.com/page/87128/(未看完)

  3. 转载 mvc:message-converters简单介绍 https://www.cnblogs.com/liaojie970/p/7736098.html

    mvc:message-converters简单介绍 说说@ResponseBody注解,很明显这个注解就是将方法的返回值作为reponse的body部分.我们进一步分析下这个过程涉及到的内容,首先就 ...

  4. 解决Nginx+Tomcat下客户端https请求跳转成http的问题

    Nginx上开启https,  后端使用Tomcat,  两者间走http协议, 但发现如果tomcat应用存在跳转时, 则客户端浏览器会出现400 Bad Request的错误, 通过抓包发现原因是 ...

  5. ssh 免密码登录配置，及其原理

    1.废话不多说,先上图   2. 典型的RSA非对称加密 RSA加密算法是一种典型的非对称加密算法,它基于大数的因式分解数学难题,它也是应用最广泛的非对称加密算法,于1978年由美国麻省理工学院(MI ...

  6. 操作循环的关键字switch，break，return的应用及区别

    break 使用break结束循环  break可以终止循环 和 switch语句的运行; break用于结束一个循环,即跳出循环体,执行循环体之后的代码: switch 使用continue提前结束 ...

  7. 工具 Windows安装Anaconda

    下载 https://mirrors.tuna.tsinghua.edu.cn/anaconda/archive/ 安装 1.勾选添加Anaconda到PATH环境变量 2.配置清华镜像 conda ...

  8. linux进程控制开发实例

    fork.c #include <sys/types.h> #include <unistd.h> #include <stdio.h> #include < ...

  9. [翻译] 使用 .NET Core 3.0 创建一个 Windows 服务

    原文: .NET Core Workers as Windows Services 在 .NET Core 3.0 中,我们引入了一种名为 Worker Service 的新型应用程序模板.此模板旨在 ...

  10. HBase篇(4)-你不知道的HFile

    [每日五分钟搞定大数据]系列,HBase第四篇 这一篇你可以知道, HFile的内部结构? HBase读文件细粒度的过程? HBase随机读写快除了MemStore之外的原因? 上一篇中提到了Hbas ...