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 解析url的search方法
Feb 09 Javascript
基于jquery的跟随屏幕滚动代码
Jul 24 Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
Apr 03 Javascript
Js控制滑轮左右滑动实例
Feb 13 Javascript
Bootstrap布局之栅格系统学习笔记
May 04 Javascript
angularJs中datatable实现代码
Jun 03 Javascript
JavaScript脚本语言是什么_动力节点Java学院整理
Jun 26 Javascript
微信小程序选择图片和放大预览图片功能
Nov 02 Javascript
bootstrap中selectpicker下拉框使用方法实例
Mar 22 Javascript
详解微信小程序图片地扯转base64解决方案
Aug 18 Javascript
antd中table展开行默认展示,且不需要前边的加号操作
Nov 02 Javascript
Vue 集成 PDF.js 实现 PDF 预览和添加水印的步骤
Jan 22 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
php中计算程序运行时间的类代码
2012/11/03 PHP
php5.5中类级别的常量使用介绍
2013/10/02 PHP
PHP批量上传图片的具体实现方法介绍.
2014/02/26 PHP
ThinkPHP框架搭建及常见问题(XAMPP安装失败、Apache/MySQL启动失败)
2016/04/15 PHP
php中时间函数date及常用的时间计算
2017/05/12 PHP
PHP的JSON封装、转变及输出操作示例
2019/09/27 PHP
JS实现文字向下滚动完整实例
2015/02/06 Javascript
JS实现仿google、百度搜索框输入信息智能提示的实现方法
2015/04/20 Javascript
jQuery实现为图片添加镜头放大效果的方法
2015/06/25 Javascript
轻松掌握JavaScript享元模式
2016/08/27 Javascript
Angular2使用jQuery的方法教程
2017/05/28 jQuery
分析javascript原型及原型链
2018/03/18 Javascript
Vue中对比scoped css和css module的区别
2018/05/17 Javascript
详解React+Koa实现服务端渲染(SSR)
2018/05/23 Javascript
详解基于electron制作一个node压缩图片的桌面应用
2019/01/29 Javascript
Json实现传值到后台代码实例
2020/06/30 Javascript
浅谈javascript如何获取文件后缀名
2020/08/07 Javascript
Python中Collections模块的Counter容器类使用教程
2016/05/31 Python
Python三种遍历文件目录的方法实例代码
2018/01/19 Python
Python装饰器用法实例总结
2018/05/26 Python
python 列表输出重复值以及对应的角标方法
2019/06/11 Python
python爬虫之快速对js内容进行破解
2019/07/09 Python
django 基于中间件实现限制ip频繁访问过程详解
2019/07/30 Python
Python virtualenv虚拟环境实现过程解析
2020/04/18 Python
详解CSS3 rem(设置字体大小) 教程
2017/11/21 HTML / CSS
CSS3中新增的对文本和字体的设置
2020/02/03 HTML / CSS
西班牙多品牌鞋店连锁店:Krack
2018/11/30 全球购物
Nike加拿大官网:Nike.com (CA)
2019/04/09 全球购物
解释下面关于J2EE的名词
2013/11/15 面试题
应届电子商务毕业自荐书范文
2014/02/11 职场文书
公共场所禁烟倡议书
2014/08/30 职场文书
优秀团员事迹材料1500字
2014/08/31 职场文书
房屋产权共有协议书范本
2014/11/03 职场文书
2015年预备党员自我评价
2015/03/04 职场文书
采购员岗位职责范本
2015/04/07 职场文书
党员观看《筑梦中国》心得体会
2016/01/18 职场文书