Javascript判斷圖片尺寸大小實(shí)例分析
通常我們判斷js圖片大小都是利用images對(duì)象,然后再用attr來獲取圖片地址再進(jìn)行判斷就可以了,下面來看一些例子。
最簡(jiǎn)單辦法:
var img=new Image();
img.src=$('#tlogo').attr('src');
if(img.width > '240'){
$('#tlogo').attr('width','240');
}
上面例子碰到如果頁面沒有加載完的時(shí)候,這時(shí)js就獲取不了圖片大小了,對(duì)此我們可以先判斷加載完成否再判斷圖片大小。
<img id="img2" src="images/1.jpg" />
<script language="JavaScript">
document.getElementById("img2").onload = function () {
alert("圖片加載已完成");
}
</script>
或者采用jquery:
$("#imageId").load(function(){
alert("加載完成!");
});
至此我們就可以對(duì)代碼進(jìn)行優(yōu)化了
$("#tlogo").load(function(){
var img=new Image();
img.src=$('#tlogo').attr('src');
if(img.width > '240'){
$('#tlogo').attr('width','240');
}
});
此處注意:#tlogo 就是你圖片地址中加的一個(gè)ID這個(gè)是必須的。
相關(guān)文章
初學(xué)JavaScript_03(ExtJs Grid的簡(jiǎn)單使用)
Ext JS Grid的簡(jiǎn)單使用:(從土豆的文檔中學(xué)到)2008-10-10簡(jiǎn)單實(shí)現(xiàn)bootstrap選項(xiàng)卡效果
這篇文章主要為大家詳細(xì)介紹了如何簡(jiǎn)單實(shí)現(xiàn)bootstrap選項(xiàng)卡效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02javascript實(shí)現(xiàn)簡(jiǎn)單的分頁特效
下面給大家匯總的幾個(gè)javascript實(shí)現(xiàn)的分頁代碼,當(dāng)然必須要結(jié)合后臺(tái)代碼實(shí)現(xiàn)。大家可以自行分析一下代碼,希望能夠給大家?guī)硪欢ǖ膸椭?/div> 2015-08-08JavaScript架構(gòu)前端不能沒有監(jiān)控系統(tǒng)原因
這篇文章主要為大家介紹了為什么前端不能沒有監(jiān)控系統(tǒng)的原因,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-06-06JavaScript Function函數(shù)類型介紹
在JS中,Function(函數(shù))類型實(shí)際上是對(duì)象;每個(gè)函數(shù)都是Function類型的實(shí)例;而且都與其他引用類型一樣具有屬性和方法2015-04-04JS簡(jiǎn)單獲取及顯示當(dāng)前時(shí)間的方法
這篇文章主要介紹了JS簡(jiǎn)單獲取及顯示當(dāng)前時(shí)間的方法,涉及javascript針對(duì)日期與時(shí)間的獲取與運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下2016-08-08超簡(jiǎn)單JS二級(jí)、多級(jí)聯(lián)動(dòng)的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)超簡(jiǎn)單JS二級(jí)、多級(jí)聯(lián)動(dòng)的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2014-02-02最新評(píng)論