탈

리사이즈 된 이미지의 높이 값 알아내기

· 2012-03-07 (수) 14:17:30 · 4686 · 1
그누보드에서는 원본이미지의 넓이가 게시판에 설정된 넓이보다 클 경우 자동으로 리사이즈 됩니다.
이 때 리사이즈 된 이미지 값은 당연히 게시판에 설정된 값이므로 쉽게 알 수 있지만, 높이 값은 따로 구해야 합니다.
혹시 중복이면 자삭하겠습니다.

이 팁은 이미지를 한 장만 올릴 수 있는 게시판에서 사용할 때를 가정하고 만든 팁입니다.

js/board.js 에서

// 이미지 폭이 테이블 폭보다 크다면 테이블폭에 맞춘다
if(target[i].width > imageWidth) {
imageHeight = parseFloat(target[i].width / target[i].height)
target[i].width = imageWidth;
target[i].height = parseInt(imageWidth / imageHeight);
target[i].style.cursor = 'pointer';
// 스타일에 적용된 이미지의 폭과 높이를 삭제한다
target[i].style.width = '';
target[i].style.height = '';
}

부분을

// 이미지 폭이 테이블 폭보다 크다면 테이블폭에 맞춘다
if(target[i].width > imageWidth) {
imageHeight = parseFloat(target[i].width / target[i].height)
target[i].width = imageWidth;
target[i].height = parseInt(imageWidth / imageHeight);
pixheight(target[i].height);//이미지리사이즈된 높이 계산 by 지운아빠
target[i].style.cursor = 'pointer';
// 스타일에 적용된 이미지의 폭과 높이를 삭제한다
target[i].style.width = '';
target[i].style.height = '';
} else {
pixheight(target[i].tmp_height);//이미지리사이즈된 높이 계산 by 지운아빠
}

로 고쳐주시면 pixheight(a) 에 리사이즈 된 높이 값이 들어가게 됩니다.


활용은

function pixheight(a){//이미지리사이즈된 높이 계산해서 버튼 위치 지정 by 지운아빠
var pixheight = a / 2;
$('.btn_pix').css('top',pixheight);
}

과 같이 할 수 있습니다.

리사이즈 된 이미지 높이의 중간에 원하는 버튼이 위치하도록 활용한 예입니다.
|

댓글 1개

2012-03-07 (수) 19:51:13
좋은팁 감사합니당 ^^
댓글을 작성하시려면 로그인이 필요합니다.

그누4 팁자료실

3,309건

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요. 나누면 즐거움이 커집니다.

+
제목 글쓴이 날짜 조회
12-03-08 조회 7,670
12-03-08 조회 5,723
12-03-07 조회 4,335
12-03-07 조회 4,687
12-03-07 조회 7,187
12-03-06 조회 7,359
12-03-06 조회 1.4만
12-03-06 조회 4,602
12-03-05 조회 5,145
12-03-05 조회 7,369
12-03-05 조회 3,612
12-03-05 조회 4,747
12-03-04 조회 6,566
12-03-04 조회 1.2만
12-03-04 조회 4,143
12-03-02 조회 6,139
12-03-02 조회 6,076
12-03-02 조회 1.2만
12-03-02 조회 5,140
12-03-02 조회 6,203