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 相关文章推荐
JQUERY 对象与DOM对象之两者相互间的转换
Apr 27 Javascript
javascript:FF/Chrome与IE动态加载元素的区别说明
Jan 26 Javascript
javascript数组遍历for与for in区别详解
Dec 04 Javascript
详解jQuery中关于Ajax的几个常用的函数
Jul 17 jQuery
vue不通过路由直接获取url中参数的方法示例
Aug 24 Javascript
JS监控关闭浏览器操作的实例详解
Sep 12 Javascript
基于vue 动态加载图片src的解决方法
Feb 05 Javascript
angularJs select绑定的model取不到值的解决方法
Oct 08 Javascript
javascript删除数组元素的七个方法示例
Sep 09 Javascript
基于JavaScript伪随机正态分布代码实例
Nov 07 Javascript
vue 根据选择条件显示指定参数的例子
Nov 09 Javascript
微信小程序实现watch监听
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笔记之:有规律大文件的读取与写入的分析
2013/04/26 PHP
在Mac OS上编译安装Nginx+PHP+MariaDB开发环境的教程
2016/02/23 PHP
php删除二维数组中的重复值方法
2018/03/12 PHP
浅谈Laravel核心解读之Console内核
2018/12/02 PHP
php源码的使用方法讲解
2019/09/26 PHP
基于jQuery的消息提示插件之旅 DivAlert(三)
2010/04/01 Javascript
JavaScript 原型链学习总结
2010/10/29 Javascript
用Javascript评估用户输入密码的强度(Knockout版)
2011/11/30 Javascript
使用jQuery validate 验证注册表单实例演示
2013/03/25 Javascript
js动态往表格的td中添加图片并注册事件
2014/06/12 Javascript
原生JavaScript编写canvas版的连连看游戏
2016/05/29 Javascript
jquery实现静态搜索功能(可输入搜索文字)
2017/03/28 jQuery
Vue.js实现模拟微信朋友圈开发demo
2017/04/20 Javascript
浅谈在vue-cli3项目中解决动态引入图片img404的问题
2020/08/04 Javascript
Antd-vue Table组件添加Click事件,实现点击某行数据教程
2020/11/17 Javascript
浅谈对yield的初步理解
2017/05/29 Python
python匹配两个短语之间的字符实例
2018/12/25 Python
python flask web服务实现更换默认端口和IP的方法
2019/07/26 Python
Python3.7.0 Shell添加清屏快捷键的实现示例
2020/03/23 Python
Jupyter Notebook 文件默认目录的查看以及更改步骤
2020/04/14 Python
python递归函数用法详解
2020/10/26 Python
python 写一个水果忍者游戏
2021/01/13 Python
一款纯css3实现的鼠标悬停动画按钮
2014/12/29 HTML / CSS
设计4个线程,其中两个线程每次对j增加1,另外两个线程对j每次减少1。写出程序。
2014/12/30 面试题
单位未婚证明范本
2014/01/18 职场文书
体育教学随笔感言
2014/02/24 职场文书
医学生临床实习自我评价
2014/03/07 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
党员个人对照检查材料思想汇报
2014/09/16 职场文书
2014年信贷员工作总结
2014/11/18 职场文书
交通安全教育主题班会
2015/08/12 职场文书
2016年教师寒假学习心得体会
2015/10/09 职场文书
Python基础之数据结构详解
2021/04/28 Python
Python实现GIF动图以及视频卡通化详解
2021/12/06 Python
TV动画《间谍过家家》公开PV
2022/03/20 日漫
如何利用python实现Simhash算法
2022/06/28 Python