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 相关文章推荐
extjs 学习笔记(一) 一些基础知识
Oct 13 Javascript
JQuery困惑—包装集 DOM节点
Oct 16 Javascript
Riot.js 快速的JavaScript单元测试框架
Nov 09 Javascript
JQuery 技巧和窍门整理(8个)
Apr 22 Javascript
写给想学习Javascript的朋友一点学习经验小结
Nov 23 Javascript
常见JS效果之图片减速度滚动实现代码
Dec 08 Javascript
JavaScript获取Url里的参数
Dec 18 Javascript
详解JavaScript的策略模式编程
Jun 24 Javascript
详解Vue方法与事件
Mar 09 Javascript
JavaScript作用域链实例详解
Jan 21 Javascript
浅谈vue3中effect与computed的亲密关系
Oct 10 Javascript
javascript sort()对数组中的元素进行排序详解
Oct 13 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中将图片gif,jpg或mysql longblob或blob字段值转换成16进制字符串
2011/08/23 PHP
php简单构造json多维数组的方法示例
2017/06/08 PHP
Javascript图像处理—为矩阵添加常用方法
2012/12/27 Javascript
js获取网页高度(详细整理)
2012/12/28 Javascript
js css后面所带参数含义介绍
2013/08/18 Javascript
javascript强大的日期函数代码分享
2013/09/04 Javascript
jQuery异步获取json数据方法汇总
2014/12/22 Javascript
javascript批量修改文件编码格式的方法
2015/01/27 Javascript
AspNet中使用JQuery boxy插件的确认框
2015/05/20 Javascript
对于jQuery性能的一些优化建议
2015/08/13 Javascript
JavaScript实现的简单烟花特效代码
2015/10/20 Javascript
AngularJS基础 ng-model 指令详解及示例代码
2016/08/02 Javascript
微信小程序 Toast自定义实例详解
2017/01/20 Javascript
微信小程序-getUserInfo回调的实例详解
2017/10/27 Javascript
JS字符串去除连续或全部重复字符的实例
2018/03/08 Javascript
微信小程序的部署方法步骤
2018/09/04 Javascript
详解如何使用node.js的开发框架express创建一个web应用
2018/12/20 Javascript
vue+element模态框中新增模态框和删除功能
2019/06/11 Javascript
koa-passport实现本地验证的方法示例
2020/02/20 Javascript
JavaScript 闭包的使用场景
2020/09/17 Javascript
浅谈Python 中整型对象的存储问题
2016/05/16 Python
python+requests+unittest API接口测试实例(详解)
2017/06/10 Python
浅谈Python采集网页时正则表达式匹配换行符的问题
2018/12/20 Python
python导入pandas具体步骤方法
2019/06/23 Python
python3实现二叉树的遍历与递归算法解析(小结)
2019/07/03 Python
Python响应对象text属性乱码解决方案
2020/03/31 Python
django rest framework serializers序列化实例
2020/05/13 Python
python如何将图片转换素描画
2020/09/08 Python
CSS书写规范、顺序和命名规则
2014/03/06 HTML / CSS
一款纯css3实现的颜色渐变按钮的代码教程
2014/11/12 HTML / CSS
Daniel Wellington官方海外旗舰店:丹尼尔惠灵顿DW手表
2018/02/22 全球购物
波兰最大的度假胜地和城市公寓租赁运营商:Sun & Snow
2018/10/18 全球购物
Diamondback自行车:拥有你的冒险
2019/04/22 全球购物
教师工作失职检讨书
2014/09/18 职场文书
2015年行政工作总结范文
2015/04/09 职场文书
Winsows11性能如何? win11性能测评多核竟比Win10差了10%
2021/11/21 数码科技