썸네일 사이즈 조절 관련 질문.. 정보
썸네일 사이즈 조절 관련 질문..본문
안녕하세요.
제가 최신글 스킨을 하나 작업중인데요...
갤러리에 올라가 있는 파일 두개를 불러와서..
1번 파일을 배경으로 깔고..
2번 파일을 테이블 우측 하단에 조그만 사진으로 넣어주는 것입니다.
여기서 문제!
첫째. 1번 파일은 배경으로 들어가기 때문에..파일을 그냥 넣어주니까..
사이즈 조절이 안된채로 올라가게 되네요. 그래서 원하는 모양이 아니라..
이미지가 큰 경우 잘린채로 그냥 배경이 되네요..
두번째. 링크를 걸려니.. 배경에는 걸 수가 없어서 조그만 이미지에만 링크를 걸 수 밖에 없네요..
해결 방법이 없을까요??
역시나 포인트는 전재산 다 걸도록 하겠습니다.
-------------------------------------------------------------------------
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
$cols = 8; // 이미지 가로갯수 // 이미지 세로 갯수는 메인에서 지정(총 이미지 수)
$imgwidth=105; //표시할 이미지의 가로사이즈
$imgheight=140; //표시할 이미지의 세로사이즈
$imgwidth_thum=51; //표시할 이미지의 가로사이즈
$imgheight_thum=68; //표시할 이미지의 세로사이즈
$image_h = 18; // 이미지 상하 간격
$col_width = (int)(99 / $cols);
$data_path = $g4[path]."/data/file/$bo_table";
?>
//for문 시작
<? for ($i=0; $i<count($list); $i++) {
if ($i>0 && $i%$cols==0) { echo "</tr><tr><td colspan='$cols' height='$image_h'></td></tr><tr>"; }
?>
<td width="<?=$col_width?>%" align="center" valign='top'>
<?
$image = $list[$i][file][0][file]; //원본
$img = "$g4[path]/data/file/$bo_table/".urlencode($list[$i][file][0][file]);
$img2 = "$g4[path]/data/file/$bo_table/".urlencode($list[$i][file][1][file]);
echo "<table width='$imgwidth' height='$imgheight' background='$img' cellpadding='0' cellspacing='0' border='0' align='center'>";
echo "<tr><td valign='bottom' align='right'><a href='{$list[$i]['href']}'><img src='$img2' width='$imgwidth_thum' height='$imgheight_thum' style='width:{$imgwidth_thum}px;height:{$imgheight_thum}px;border:1px solid #111111;'></a></td></tr></table>";
?>
</td>
<? } ?>
제가 최신글 스킨을 하나 작업중인데요...
갤러리에 올라가 있는 파일 두개를 불러와서..
1번 파일을 배경으로 깔고..
2번 파일을 테이블 우측 하단에 조그만 사진으로 넣어주는 것입니다.
여기서 문제!
첫째. 1번 파일은 배경으로 들어가기 때문에..파일을 그냥 넣어주니까..
사이즈 조절이 안된채로 올라가게 되네요. 그래서 원하는 모양이 아니라..
이미지가 큰 경우 잘린채로 그냥 배경이 되네요..
두번째. 링크를 걸려니.. 배경에는 걸 수가 없어서 조그만 이미지에만 링크를 걸 수 밖에 없네요..
해결 방법이 없을까요??
역시나 포인트는 전재산 다 걸도록 하겠습니다.
-------------------------------------------------------------------------
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
$cols = 8; // 이미지 가로갯수 // 이미지 세로 갯수는 메인에서 지정(총 이미지 수)
$imgwidth=105; //표시할 이미지의 가로사이즈
$imgheight=140; //표시할 이미지의 세로사이즈
$imgwidth_thum=51; //표시할 이미지의 가로사이즈
$imgheight_thum=68; //표시할 이미지의 세로사이즈
$image_h = 18; // 이미지 상하 간격
$col_width = (int)(99 / $cols);
$data_path = $g4[path]."/data/file/$bo_table";
?>
//for문 시작
<? for ($i=0; $i<count($list); $i++) {
if ($i>0 && $i%$cols==0) { echo "</tr><tr><td colspan='$cols' height='$image_h'></td></tr><tr>"; }
?>
<td width="<?=$col_width?>%" align="center" valign='top'>
<?
$image = $list[$i][file][0][file]; //원본
$img = "$g4[path]/data/file/$bo_table/".urlencode($list[$i][file][0][file]);
$img2 = "$g4[path]/data/file/$bo_table/".urlencode($list[$i][file][1][file]);
echo "<table width='$imgwidth' height='$imgheight' background='$img' cellpadding='0' cellspacing='0' border='0' align='center'>";
echo "<tr><td valign='bottom' align='right'><a href='{$list[$i]['href']}'><img src='$img2' width='$imgwidth_thum' height='$imgheight_thum' style='width:{$imgwidth_thum}px;height:{$imgheight_thum}px;border:1px solid #111111;'></a></td></tr></table>";
?>
</td>
<? } ?>
댓글 전체
배경에 들어갈 이미지는 썸네일 만들기 방식으로 조금 큰 썸네일로 만들면 됩니다
첨부 이미지 처럼 인물 일때는 알맞은 부위를 잘라서 썸네일을 만들어야 하는데 그게 쉬운방법이 아니지요
GD 사용법을 모른 다면 불가능한 일이겠구요
배경에도 링크가 걸리게 하는 것은 onmousedown을 사용하면 됩니다
첨부 이미지 처럼 인물 일때는 알맞은 부위를 잘라서 썸네일을 만들어야 하는데 그게 쉬운방법이 아니지요
GD 사용법을 모른 다면 불가능한 일이겠구요
배경에도 링크가 걸리게 하는 것은 onmousedown을 사용하면 됩니다
파일을 등록할 때 사이즈 비율을 생각해서 3:4사이즈로 맞춰서 업로드 할 예정이구요.
그렇기에 맞는 부위를 자를 필요없이 사이즈만 줄이면 됩니다.
onmousedown 감사해요~
그렇기에 맞는 부위를 자를 필요없이 사이즈만 줄이면 됩니다.
onmousedown 감사해요~
배경으로 깔지 마시고
레이어1 레이어2로 하시면 사이즈는 조절 되지 않을까요? 링크도 걸리구요
레이어1 레이어2로 하시면 사이즈는 조절 되지 않을까요? 링크도 걸리구요
그래도 된다고 생각은 하고 있지만, css로 레이아웃 짤 줄을 몰라서요..OTL
가능하시면 좀 부탁드릴께요..^^
가능하시면 좀 부탁드릴께요..^^
원본 이미지가 크다고 봤을때는 썸네일을 각각 두개 따로 만들어서 알송달송님 말씀처럼 하는것이 좋을것 같습니다. 썸네일 만들어 놓으면 다른데 사용하기도 좋구요
어째든 썸네일이 됬든 원본이 됬든 레이어를 이용하신다면
<td style="position:relative">
<div style="position:absolute; width:200px; height:200px; left: 0px; top: 0px; z-index:1; ">
<img src="배경이미지" width="200" height="200">
</div>
<div style="position:absolute; width:50px; height:50px; left: 150px; top: 150px; z-index:2; " >
<img src="작은이미지" width="50" height="50">
</div>
</td>
어째든 썸네일이 됬든 원본이 됬든 레이어를 이용하신다면
<td style="position:relative">
<div style="position:absolute; width:200px; height:200px; left: 0px; top: 0px; z-index:1; ">
<img src="배경이미지" width="200" height="200">
</div>
<div style="position:absolute; width:50px; height:50px; left: 150px; top: 150px; z-index:2; " >
<img src="작은이미지" width="50" height="50">
</div>
</td>
서버 디도스 공격으로 ftp가 죽어 버렸어요..ㅎㅎ
확인하고 점수 쏠께요..^^;;;
확인하고 점수 쏠께요..^^;;;
잘되네요 고마워요~