js判断屏幕分辨率的代码


Posted in Javascript onJuly 16, 2013

一般我们可以通过下面的代码判断分辨率

<script language="JavaScript">  
<!-- Begin  
function redirectPage() {  
var w3water=screen.width;
var h3water=screen.height;
alert("经系统检测,你的屏幕分辨率为 " + w3water+"*"+ h3water + "by 三水点靠木3water.com");  
}  
// End -->  
</script>

js判断浏览器分辨率

<script>
function ScreenWidth(){
            if (screen.width == 1440){
              alert("1440*900");
          }else  if (screen.width == 800){
                alert("800*600");
         }else if (screen.width == 1152){
                 alert("1152*864");
         }else {
                  alert("do not know!");
         }
}
</script>
<input type="button"  name="" value="fenbianli "  onclick=" ScreenWidth()"/>

说明:这段js代码可改造一下,改为screen.width>=1024     screen.width=800两种情况

所以我选择使用下面的代码:

if(screen.width>=1440){
alert('宽屏幕可以加载广告了');
//一些广告代码
}

用JS判断不同分辨率调用不同的CSS样式文件

最近看一个网站,发现显示器不同的分辨率,样式文件调用的也不一样,今天写了一个例子研究一下,
 

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" id="sc" type="text/css" href="css/c1.css"/>
<script type="text/javascript"> 
window.onload=function(){
    var sc=document.getElementById("sc");
    var d=document.getElementById("d");
    if(screen.width>1024)  //获取屏幕的的宽度
    {
      sc.setAttribute("href","css/c2.css");   //设置css引入样式表的路径
      d.innerHTML = "你的电脑屏幕宽度大于1024,我的宽度是 1200px, 背景色现在是红色。";
    }
    else{     sc.setAttribute("href","css/c1.css");
     d.innerHTML = "你的电脑屏幕宽度小于或是等于1024,我的宽度是 960px, 背景色现在是蓝色。";
    }
    }
</script>
</head> 
<body>
<div id="d"></div> 
</body>
</html>

c1.css里面的内容

*{ margin:0; padding:0;}div{ width:960px; height:400px; margin:0 auto; background:blue; color:#ffffff;}
 
c2.css里面的内容
*{ margin:0; padding:0;}
div{ width:1200px; height:400px; margin:0 auto; background:red; color:#fff;}
Javascript 相关文章推荐
prototype 的说明 js类
Sep 07 Javascript
jquery网页回到顶部效果(图标渐隐,自写)
Jun 16 Javascript
js中数组排序sort方法的原理分析
Nov 20 Javascript
jquery实现的省市区三级联动
Apr 02 Javascript
前端js实现文件的断点续传 后端PHP文件接收
Oct 14 Javascript
微信小程序 教程之模块化
Oct 17 Javascript
JavaScript中Array对象用法实例总结
Nov 29 Javascript
jQuery实现字符串全部替换的方法【推荐】
Mar 09 Javascript
关于vue.js过渡css类名的理解(推荐)
Apr 10 Javascript
基于Bootstrap的标签页组件及bootstrap-tab使用说明
Jul 25 Javascript
vue 项目接口管理的实现
Jan 17 Javascript
如何在postman中添加cookie信息步骤解析
Jun 30 Javascript
js 调用父窗口的具体实现代码
Jul 15 #Javascript
JavaScript实现点击按钮后变灰避免多次重复提交
Jul 15 #Javascript
JS 去前后空格大全(IE9亲测)
Jul 15 #Javascript
Ext中下拉列表ComboBox组件store数据格式用法介绍
Jul 15 #Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 #Javascript
鼠标移动到图片名上,显示图片的简单实例
Jul 14 #Javascript
JS中获取数据库中的值的方法
Jul 14 #Javascript
You might like
基于qmail的完整WEBMAIL解决方案安装详解
2006/10/09 PHP
PHP上传文件时文件过大$_FILES为空的解决方法
2013/11/26 PHP
PHPMailer使用QQ邮箱实现邮件发送功能
2017/08/18 PHP
Yii2框架配置文件(Application属性)与调试技巧实例分析
2019/05/27 PHP
jquery DOM操作 基于命令改变页面
2010/05/06 Javascript
idTabs基于JQuery的根据URL参数选择Tab插件
2012/04/11 Javascript
解析John Resig Simple JavaScript Inheritance代码
2012/12/03 Javascript
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
2013/11/22 Javascript
jQuery html()方法使用不了无法显示内容的问题
2014/08/06 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
深入学习JavaScript中的Rest参数和参数默认值
2015/07/28 Javascript
JS实现可关闭的对联广告效果代码
2015/09/14 Javascript
JavaScript读二进制文件并用ajax传输二进制流的方法
2016/07/18 Javascript
Bootstrap导航条的使用和理解3
2016/12/14 Javascript
基于NodeJS+MongoDB+AngularJS+Bootstrap开发书店案例分析
2017/01/12 NodeJs
JavaScript通过filereader接口读取文件
2017/05/10 Javascript
使用Vue组件实现一个简单弹窗效果
2018/04/23 Javascript
微信小程序结合Storage实现搜索历史效果
2019/05/18 Javascript
nodejs实现日志读取、日志查找及日志刷新的方法分析
2019/05/20 NodeJs
Vue实现简易购物车页面
2020/12/30 Vue.js
[07:08]2014DOTA2西雅图国际邀请赛 小组赛7月11日TOPPLAY
2014/07/11 DOTA
Python操作MongoDB数据库PyMongo库使用方法
2015/04/27 Python
Python中使用Beautiful Soup库的超详细教程
2015/04/30 Python
举例详解Python中threading模块的几个常用方法
2015/06/18 Python
Python实现的简单hangman游戏实例
2015/06/28 Python
Python实现替换文件中指定内容的方法
2018/03/19 Python
详解Django解决ajax跨域访问问题
2018/08/24 Python
python匹配两个短语之间的字符实例
2018/12/25 Python
Python常见的pandas用法demo示例
2019/03/16 Python
pytorch 自定义参数不更新方式
2020/01/06 Python
python函数enumerate,operator和Counter使用技巧实例小结
2020/02/22 Python
让你相见恨晚的十个Python骚操作
2020/11/18 Python
HTML5 MiranaVideo播放器 (代码开源)
2010/06/11 HTML / CSS
美国最大的高尔夫发球时间预订网站:TeeOff.com
2018/03/28 全球购物
升职自荐信范文
2013/10/05 职场文书
西游降魔篇观后感
2015/06/15 职场文书