快捷導(dǎo)航

js判斷設(shè)備是否為PC并調(diào)整圖片大小

更新時(shí)間：2014年02月12日 09:53:03 作者：

這篇文章主要介紹了js判斷設(shè)備是否為PC并調(diào)整圖片大小,需要的朋友可以參考下

 
<html> 
<head> 
<script type="text/javascript"> 
/* 判斷設(shè)備是否為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; 
} 

/* 調(diào)整圖片大小 */ 
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; 
} 

/* 設(shè)置不同設(shè)備的縮放策略 */ 
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> 

您可能感興趣的文章:

相關(guān)文章

原生JS實(shí)現(xiàn)翻書特效
這篇文章主要為大家詳細(xì)介紹了原生JS實(shí)現(xiàn)翻書特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-10-10
如何在JavaScript中運(yùn)行.NET?Core代碼詳情
這篇文章主要介紹了在JavaScript中運(yùn)行.NET?Core代碼詳情，DotNetJS可以將C#項(xiàng)目編譯為與任何環(huán)境兼容的單文件JavaScript庫，變可以在JavaScript中運(yùn)行.NET?Core代碼，相關(guān)操作分享詳情，需要的小伙伴可以參考一下
2022-04-04
詳解JavaScript之ES5的繼承
這篇文章主要介紹了JavaScript之ES5的繼承的相關(guān)資料，文中示例代碼非常詳細(xì)，幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下
2020-07-07
2007/12/23更新創(chuàng)意無限,簡(jiǎn)單實(shí)用(javascript log)
在javascript開發(fā)過程中，如果總是使用alert的方式調(diào)試程序，在某些簡(jiǎn)單的程序中是可行的. 但是在通常的項(xiàng)目很復(fù)雜，這種方式已經(jīng)很難滿足，企業(yè)級(jí)開發(fā)的需要。
2007-12-12
IE瀏覽器兼容Firefox的JS腳本的代碼
對(duì)于經(jīng)常用js的朋友，有時(shí)候一段腳本并不是兩個(gè)瀏覽器都兼容的，下面一些對(duì)ie和firefox都兼容的一些代碼，大家可以學(xué)習(xí)下。
2008-10-10
一文詳解uniapp中如何使用easycom自定義組件
easycom是uniapp的一種組件自動(dòng)引入的規(guī)則,使用這種規(guī)則可以使?jié)M足規(guī)則的組件無需注冊(cè)直接使用,下面這篇文章主要給大家介紹了關(guān)于uniapp中如何使用easycom自定義組件的相關(guān)資料,需要的朋友可以參考下
2023-05-05
Bootstrap風(fēng)格的zTree右鍵菜單
這篇文章主要介紹了Bootstrap風(fēng)格的zTree右鍵菜單功能，實(shí)現(xiàn)代碼分為html，css和js三部分，代碼簡(jiǎn)單易懂，非常不錯(cuò)，需要的朋友可以參考下
2017-02-02
微信小程序獲取手機(jī)驗(yàn)證碼的方法
這篇文章主要為大家詳細(xì)介紹了微信小程序獲取手機(jī)驗(yàn)證碼的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-05-05
JavaScript實(shí)現(xiàn)一個(gè)多少秒后自動(dòng)跳轉(zhuǎn)的頁面(案例代碼)
最近遇到這樣一個(gè)需求是用js簡(jiǎn)單實(shí)現(xiàn)一個(gè)多少秒后自動(dòng)跳轉(zhuǎn)的頁面，實(shí)現(xiàn)代碼非常簡(jiǎn)單，對(duì)js自動(dòng)跳轉(zhuǎn)頁面相關(guān)知識(shí)感興趣的朋友一起看看吧
2023-01-01
微信小程序組件化開發(fā)的示例介紹
雖然小程序在剛推出時(shí)是不支持組件化的,但如今小程序開始支持自定義組件開發(fā),下面這篇文章主要給大家介紹了關(guān)于微信小程序組件化開發(fā)的相關(guān)資料,需要的朋友可以參考下
2023-03-03