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进行数组遍历如何跳出当前的each循环
Jun 05 Javascript
浅谈jquery回调函数callback的使用
Jan 30 Javascript
readonly和disabled属性的区别
Jul 26 Javascript
jquery实现简单合拢与展开网页面板的方法
Sep 01 Javascript
AngularJS 简单应用实例
Jul 28 Javascript
jQuery validate插件功能与用法详解
Dec 15 Javascript
vue实现百度搜索下拉提示功能实例
Jun 14 Javascript
浅谈vue+webpack项目调试方法步骤
Sep 11 Javascript
JS实现数组的增删改查操作示例
Aug 29 Javascript
vuejs中父子组件之间通信方法实例详解
Jan 17 Javascript
JS常见错误(Error)及处理方案详解
Jul 02 Javascript
基于vue+echarts数据可视化大屏展示的实现
Dec 25 Vue.js
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
丧钟首部独立剧集《丧钟:骑士与龙》北美正式开播,场面血腥
2020/04/09 欧美动漫
PHP.MVC的模板标签系统(二)
2006/09/05 PHP
BBS(php &amp; mysql)完整版(四)
2006/10/09 PHP
PHP 引用文件技巧
2010/03/02 PHP
jquery 插件 人性化的消息显示
2008/01/21 Javascript
Jquery 基础学习笔记
2009/05/29 Javascript
js 剪切板的用法(clipboardData.setData)与js match函数介绍
2013/11/19 Javascript
JS文本获得焦点清除文本文字的示例代码
2014/01/13 Javascript
jquery实现标题字体变换的滑动门菜单效果
2015/09/07 Javascript
浅析Bootstrap缩略图组件与警示框组件
2016/04/29 Javascript
深入浅析JavaScript中的Function类型
2016/07/09 Javascript
分享javascript、jquery实用代码段
2016/10/20 Javascript
JavaScript编写棋盘覆盖代码详解
2017/08/28 Javascript
js实现扫雷小程序的示例代码
2017/09/27 Javascript
react-native-video实现视频全屏播放的方法
2018/03/19 Javascript
30分钟快速入门掌握ES6/ES2015的核心内容(下)
2018/04/18 Javascript
JS实现字符串去重及数组去重的方法示例
2018/04/21 Javascript
加快Vue项目的开发速度的方法
2018/12/12 Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
2020/11/04 Javascript
python中使用sys模板和logging模块获取行号和函数名的方法
2014/04/15 Python
python与php实现分割文件代码
2017/03/06 Python
python实现俄罗斯方块
2018/06/26 Python
Python跳出多重循环的方法示例
2019/07/03 Python
PyQt5中向单元格添加控件的方法示例
2020/03/24 Python
python 多线程爬取壁纸网站的示例
2021/02/20 Python
HTML5调用手机发短信和打电话功能
2020/04/29 HTML / CSS
英国最大的自有市场,比亚马逊便宜:Flubit
2019/03/19 全球购物
KENZO官网:高田贤三在法国创立的品牌
2019/05/16 全球购物
大学生找工作推荐信范文
2013/11/28 职场文书
《我不是最弱小的》教学反思
2014/02/23 职场文书
公路绿化方案
2014/05/12 职场文书
入党积极分子半年考察意见
2015/06/02 职场文书
监护人证明
2015/06/19 职场文书
婚宴新郎致辞
2015/07/28 职场文书
python+opencv实现视频抽帧示例代码
2021/06/11 Python
详解SQL报错盲注
2022/07/23 SQL Server