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 相关文章推荐
javascript小数四舍五入多种方法实现
Dec 23 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
Apr 16 Javascript
Javascript高级技巧分享
Feb 25 Javascript
javascript使用正则表达式实现去掉空格之后的字符
Feb 15 Javascript
纯javascript判断查询日期是否为有效日期
Aug 24 Javascript
Web前端新人笔记之jquery入门心得(新手必看)
May 17 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
Aug 03 Javascript
简单实现JS倒计时效果
Dec 23 Javascript
浅析Node.js非对称加密方法
Jan 29 Javascript
JSON.stringify()方法讲解
Jan 31 Javascript
tsconfig.json配置详解
May 17 Javascript
keep-alive不能缓存多层级路由菜单问题解决
Mar 10 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中file_get_content 和curl以及fopen 效率分析
2014/09/19 PHP
thinkPHP商城公告功能开发问题分析
2016/12/01 PHP
phpMyAdmin通过密码漏洞留后门文件
2018/11/20 PHP
jquery 中多条件选择器,相对选择器,层次选择器的区别
2012/07/03 Javascript
鼠标移到图片上变大显示而不是放大镜效果
2014/06/15 Javascript
JS动态修改iframe内嵌网页地址的方法
2015/04/01 Javascript
jQuery子窗体取得父窗体元素的方法
2015/05/11 Javascript
详解React开发中使用require.ensure()按需加载ES6组件
2017/05/12 Javascript
自制简易打赏功能的实例
2017/09/02 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
2017/12/13 Javascript
Angular网络请求的封装方法
2018/05/22 Javascript
AngularJS实现的自定义过滤器简单示例
2019/02/02 Javascript
Layui实现带查询条件的分页
2019/07/27 Javascript
基于Vue的商品主图放大镜方案详解
2019/09/19 Javascript
在webstorm中配置less的方法详解
2020/09/25 Javascript
JS模拟实现京东快递单号查询
2020/11/30 Javascript
Python中遇到的小问题及解决方法汇总
2017/01/11 Python
基于python socketserver框架全面解析
2017/09/21 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
2018/07/26 Python
Python Django基础二之URL路由系统
2019/07/18 Python
详解Python3中的 input() 函数
2020/03/18 Python
如何在python中处理配置文件代码实例
2020/09/27 Python
python实现图像高斯金字塔的示例代码
2020/12/11 Python
VSCode中autopep8无法运行问题解决方案(提示Error: Command failed,usage)
2021/03/02 Python
canvas 橡皮筋式线条绘图应用方法
2019/02/13 HTML / CSS
史蒂夫·马登加拿大官网:Steve Madden加拿大
2017/11/18 全球购物
英国羊绒服装购物网站:Pure Collection
2018/10/22 全球购物
远程学习的教学用品和家庭学习资源:Really Good Stuff
2020/04/27 全球购物
乌克兰设计师和品牌的服装:Love&Live
2020/04/14 全球购物
机电一体化专业应届本科生求职信
2013/09/27 职场文书
护理专科毕业生自荐书范文
2014/02/19 职场文书
婚礼答谢宴主持词
2014/03/14 职场文书
培训班开班仪式主持词
2014/03/28 职场文书
月考总结与反思
2015/10/22 职场文书
浅谈MySQL中的六种日志
2022/03/23 MySQL
Win11 22H2 2022怎么更新? 获得Win1122H22022版本升级技巧
2022/09/23 数码科技