조회 : 103
현제 여기게 사용된 게시판에 적용되어있습니다.
사용법
<img src=http://www.mins01.com/for2007/image_manager/middle/top/thisisweb.gif
onload="image_auto_resize(this,50,50);"
onmouseover="image_auto_resize(this,50,50);">
지정된 이미지에 자동 리사이즈를 적용합니다.
사용법2
image_auto_resize_inarea(document.getElementById('div_area'),100,'',true);
document.getElementById('div_area') 안에서의 모든 img에 자동 리사이즈를 적용합니다.
//============================================================================
// 이미지 자동 리사이즈
//============================================================================
function image_auto_resize(this_s,width,height){
var ta_image = new Image();
ta_image.src = this_s.src;
if(!width){this_s.removeAttribute('width');
this_s.style.width='auto';}
else if(width < ta_image.width){
this_s.width = width;
}else{
this_s.width = ta_image.width;
}
if(!height){this_s.removeAttribute('height');
this_s.style.height='auto';}
else if(height < ta_image.height){
this_s.height = height;
}else{
this_s.height = ta_image.height;
}
}
function image_auto_resize_inarea(this_s,width,height,view){
//this_s안의 모든 이미지는 자동 리사이즈 된다.
//alert(this_s.childNodes.length);
if(!view){view=true;}
if(!this_s){return;}
if(this_s.nodeType!=1){return;}
for(var i=0,m=this_s.childNodes.length;i<m;i++){
var ta = this_s.childNodes[i];
if(ta.nodeName=='IMG'){
//ta.style.border='1px solid #333333';
image_auto_resize(ta,width,height);
if(view){
if(!ta.title){ta.title=ta.src;}
if(!ta.onclick){
ta.style.cursor='pointer';
ta.onclick=function(){js_image_view(this,1);}
}
if(!ta.onload)
ta.onload=function(){image_auto_resize(this,width,height);}
if(!ta.onmouseover)
ta.onmouseover=function(){image_auto_resize(this,width,height);}
}
}
if(ta.childNodes.length>0){
image_auto_resize_inarea(ta,width,height);
}
}
return;
}
사용 제약은
"공대여자는 이쁘다"를 나타내야 쓸 수 있습니다.
제목 |
---|
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js) |
유용한 리눅스(LINUX) 명령어 |
[공지] 기술 게시판 |
일 |
월 |
화 |
수 |
목 |
금 |
토 |
---|---|---|---|---|---|---|
4.28
|
4.29
|
4.30
|
5.1
|
5.2
|
5.3
|
5.4
|
5.5
|
5.6
|
5.7
|
5.8
|
5.9
|
5.11
|
|
5.12
|
5.13
|
5.14
|
5.15
|
5.16
|
5.17
|
5.18
|
5.19
|
5.20
|
5.21
|
5.22
|
5.23
|
5.24
|
5.25
|
5.26
|
5.27
|
5.28
|
5.29
|
5.30
|
5.31
|
6.1
|