js判断设备是否为PC并调整图片大小


Posted in Javascript onFebruary 12, 2014
<html> 
<head> 
<script type="text/javascript"> 
/* 判断设备是否为PC */ 
function isPC() { 
var userAgentInfo = navigator.userAgent; 
var Agents = new Array("Android", "iPhone", "SymbianOS","Windows Phone", "iPad", "iPod"); 
var flag = true; 
for ( var v = 0; v < Agents.length; v++) { 
if (userAgentInfo.indexOf(Agents[v]) > 0) { 
flag = false; 
break; 
} 
} 
return flag; 
} /* 调整图片大小 */ 
function AutoResizeImage(maxWidth, maxHeight, objImg) { 
var img = new Image(); 
img.src = objImg.src; 
var hRatio; 
var wRatio; 
var Ratio = 1; 
var w = img.width; 
var h = img.height; 
wRatio = maxWidth / w; 
hRatio = maxHeight / h; 
if (maxWidth == 0 && maxHeight == 0) { 
Ratio = 1; 
} else if (maxWidth == 0) { // 
if (hRatio < 1) Ratio = hRatio; 
} else if (maxHeight == 0) { 
if (wRatio < 1) Ratio = wRatio; 
} else if (wRatio < 1 || hRatio < 1) { 
Ratio = (wRatio <= hRatio ? wRatio : hRatio); 
} 
if (Ratio < 1) { 
w = w * Ratio; 
h = h * Ratio; 
} 
objImg.height = h; 
objImg.width = w; 
} 
/* 设置不同设备的缩放策略 */ 
function setImg(tagid,pcWidth,pcHeight,appWidth,appHeight){ 
var tag=document.getElementById(tagid); 
var images=tag.getElementsByTagName("img"); 
for(var i=0;i<images.length;i++){ 
if(isPC){ 
AutoResizeImage(pcWidth, pcHeight, images[i]); 
}else{ 
AutoResizeImage(appWidth, appHeight, images[i]); 
} 
} 
} 
window.onload=function(){ 
setImg('imgDIV',300,0,300,0); 
} 
</script> 
</head> 
<body> 
<div id="imgDIV"> 
<img alt="" src="http://192.168.1.116:9999/ffzx/news/20140205/015212022_1.jpg" /> 
<div> 
<img alt="" src="http://192.168.1.116:9999/ffzx/news/20140208/1386835169183.jpg" /> 
</div> 
</div> 
<br> 
</body> 
</html>
Javascript 相关文章推荐
ASP.NET jQuery 实例18 通过使用jQuery validation插件校验DropDownList
Feb 03 Javascript
一样的table?不一样的table(可编辑状态table)
Sep 19 Javascript
javascript面向对象特性代码实例
Jun 12 Javascript
JavaScript Window浏览器对象模型方法与属性汇总
Apr 20 Javascript
jquery+php实现滚动的数字特效
Nov 29 Javascript
jQuery实现的文字hover颜色渐变效果实例
Feb 20 Javascript
基于JS实现导航条flash导航条
Jun 17 Javascript
AngularJS获取json数据的方法详解
May 27 Javascript
Javascript 一些需要注意的细节(必看篇)
Jul 08 Javascript
Vue 实现树形视图数据功能
May 07 Javascript
JS实现移动端触屏拖拽功能
Jul 31 Javascript
JS数组中对象去重操作示例
Jun 04 Javascript
Jquery Uploadify上传带进度条的简单实例
Feb 12 #Javascript
js弹出div并显示遮罩层
Feb 12 #Javascript
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
Feb 12 #Javascript
jquery实现网页查找功能示例分享
Feb 12 #Javascript
使用jQuery和PHP实现类似360功能开关效果
Feb 12 #Javascript
对Jquery中的ajax再封装,简化操作示例
Feb 12 #Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
Feb 12 #Javascript
You might like
php数组函数序列之array_slice() - 在数组中根据条件取出一段值,并返回
2011/11/07 PHP
浅析PHP7新功能及语法变化总结
2016/06/17 PHP
Ajax和PHP正则表达式验证表单及验证码
2016/09/24 PHP
详解PHP神奇又有用的Trait
2019/03/25 PHP
优秀js开源框架-jQuery使用手册(1)
2007/03/10 Javascript
jQuery选择没有colspan属性的td的代码
2010/07/06 Javascript
js判断页面中是否有指定控件的简单实例
2014/03/04 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
JavaScript:Date类型全面解析
2016/05/19 Javascript
Javascript实现前端简单的路由实例
2016/09/11 Javascript
vue插件tab选项卡使用小结
2016/10/27 Javascript
Angular2 PrimeNG分页模块学习
2017/01/14 Javascript
jQuery实现动态生成表格并为行绑定单击变色动作的方法
2017/04/17 jQuery
原生js实现简单的模态框示例
2017/09/08 Javascript
解决ie img标签内存泄漏的问题
2017/10/13 Javascript
js判断传入时间和当前时间大小实例(超简单)
2018/01/11 Javascript
JS实现的贪吃蛇游戏完整实例
2019/01/18 Javascript
详解Node.js异步处理的各种写法
2019/06/09 Javascript
小程序api实现promise封装过程解析
2019/11/21 Javascript
详解vue-cli项目在IE浏览器打开报错解决方法
2020/12/10 Vue.js
Python ORM框架SQLAlchemy学习笔记之映射类使用实例和Session会话介绍
2014/06/10 Python
一些Python中的二维数组的操作方法
2015/05/02 Python
浅析Python编写函数装饰器
2016/03/18 Python
PyCharm搭建Spark开发环境实现第一个pyspark程序
2019/06/13 Python
python openvc 裁剪、剪切图片 提取图片的行和列
2019/09/19 Python
tensorflow模型文件(ckpt)转pb文件的方法(不知道输出节点名)
2020/04/22 Python
python脚本第一行如何写
2020/08/30 Python
在python中对于bool布尔值的取反操作
2020/12/11 Python
CSS3 :not()选择器实现最后一行li去除某种css样式
2016/10/19 HTML / CSS
移动HTML5前端框架—MUI的使用
2017/12/18 HTML / CSS
德国网上花店:Valentins
2018/08/15 全球购物
Fanatics英国官网:美国体育电商
2018/11/06 全球购物
好的自荐信的要求
2013/10/30 职场文书
高中自我鉴定
2013/12/20 职场文书
2014年项目经理工作总结
2014/11/24 职场文书
傅雷家书读书笔记
2015/06/29 职场文书