이미지의 Height값을 받아오는 중 문제가 생겨서 질문드립니다.
본문
게시판 페이지를 제작 중인데,
게시글을 누르면, 뷰페이지에 첨부된 이미지 파일의 Height값을 구해서
table에 height값을 자동으로 넣으려고 합니다.
뷰페이지에 들어가는 이미지는
$img2 = "$g4[path]/data/file/$bo_table/".urlencode($list[$i][file][1][file]);
다음과 같은데, 사이즈를 얻어오기 위해서
$size = getimagesize($img2);
로 코딩해서 사이즈를 얻어오려 하면, 게시글들의 이미지들의 Height값을 다 긁어오는데
가장 마지막의 이미지 Height값으로 적용이 됩니다.
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td width="800" height="<?= $size[1] ?>"
Style="background:#fff;"><img
src="<?=$list[0][file][0][path]?>/<?=$list[0][file][1][file]?>"
width="800" height="<?= $size[1] ?>" id="main_img"></td>
</tr>
가장 마지막 이미지의 Height값이 아닌, 각각의 이미지의 Height값을 적용시키려면 어떻게 해야 될까요?
다른 분들의 조언 부탁드립니다.
<?
for ($i=0; $i<count($list); $i++)
{
$title = "자세히보기";
$content = cut_str(get_text($list[$i][wr_content]), 180);
$subject = cut_str(get_text($list[$i][subject]), 100, '...');
$img_width = '160'; // 이미지 개당 가로크기
$img_height = '120'; // 이미지 개당 세로크기
$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]);
$size = getimagesize($img2);
if (!file_exists($img) || !$list[$i][file][0][file])
$img = "$board_skin_path/img/no_image.gif";
if ($is_admin)
$view_href = "$g4[bbs_path]/board.php?bo_table=$bo_table&wr_id={$list[$i][wr_id]}";
else
$view_href = "#";
$checkbox = "";
if ($is_checkbox)
$checkbox = "<input type=checkbox name=chk_wr_id[] value='{$list[$i][wr_id]}'>";
$tr = "";
if ($i && $i%$board[bo_gallery_cols]==0)
$tr = "</tr><tr>";
echo "$tr";
echo <<<HEREDOC
<td width="{$td_width}%" valign="top" align="center" >
<table width="200" height="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<img src="{$img}" width='{$img_width}' height='{$img_height}' border="0" title="$title" style="border:0px solid #000000;cursor:pointer;" onClick="view_img('$img2')">
</td>
</tr>
<tr>
<td align="center" onClick="view_img('$img2')" style="cursor:pointer;">{$checkbox} {$subject}</td>
</tr>
</table>
</td>
HEREDOC;
}
// 나머지 td 를 채운다.
if ($i == 0)
echo "<td colspan='$board[bo_gallery_cols]' height=50 align=center>게시물이 없습니다.</td>";
?>
<!-- 게시판 목록 시작 -->
<table width="<?=$width?>" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td>
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td width="800" height="<?= $size[1] ?>" Style="background:#fff;"><img src="<?=$list[0][file][0][path]?>/<?=$list[0][file][1][file]?>" width="800" height="<?= $size[1] ?>" id="main_img"></td>
</tr>
</table>
<script language="JavaScript">
function view_img(img2){
document.getElementById("main_img").src = img2;
}
</script>
답변 2
배열을 이용해서 해결해야 할 문제입니다.
배열의 구조는 key : value 형식으로 되어 있습니다.
<?
$size = Array();
for ($i=0; $i<count($list); $i++)
{
$title = "자세히보기";
$content = cut_str(get_text($list[$i][wr_content]), 180);
$subject = cut_str(get_text($list[$i][subject]), 100, '...');
$img_width = '160'; // 이미지 개당 가로크기
$img_height = '120'; // 이미지 개당 세로크기
$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]);
$size[$i] = getimagesize($img2);
if (!file_exists($img) || !$list[$i][file][0][file])
$img = "$board_skin_path/img/no_image.gif";
if ($is_admin)
$view_href = "$g4[bbs_path]/board.php?bo_table=$bo_table&wr_id={$list[$i][wr_id]}";
else
$view_href = "#";
$checkbox = "";
if ($is_checkbox)
$checkbox = "<input type=checkbox name=chk_wr_id[] value='{$list[$i][wr_id]}'>";
$tr = "";
if ($i && $i%$board[bo_gallery_cols]==0)
$tr = "</tr><tr>";
echo "$tr";
echo <<<HEREDOC
<td width="{$td_width}%" valign="top" align="center" >
<table width="200" height="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<img src="{$img}" width='{$img_width}' height='{$img_height}' border="0" title="$title" style="border:0px solid #000000;cursor:pointer;" onClick="view_img('$img2')">
</td>
</tr>
<tr>
<td align="center" onClick="view_img('$img2')" style="cursor:pointer;">{$checkbox} {$subject}</td>
</tr>
</table>
</td>
HEREDOC;
}
// 나머지 td 를 채운다.
if ($i == 0)
echo "<td colspan='$board[bo_gallery_cols]' height=50 align=center>게시물이 없습니다.</td>";
?>
<!-- 게시판 목록 시작 -->
<table width="<?=$width?>" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td>
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td width="800" height="<?= $size[0][1] ?>" Style="background:#fff;"><img src="<?=$list[0][file][0][path]?>/<?=$list[0][file][1][file]?>" width="800" height="<?= $size[0][1] ?>" id="main_img"></td>
</tr>
</table>
<script language="JavaScript">
function view_img(img2){
document.getElementById("main_img").src = img2;
}
</script>
이렇게 바꿔보셔서 한번 해 보세요.
배열을 이용해서 해결할 수 있는 거였군요!
말씀하신대로 height="<?= $size[0][1] ?>" 이렇게 하니 height 값이 첫번째로 고정이 되는데, 이걸 바꾸려면 다른 방법이 혹시 없을까요?
key 부분을 변경하셔야 될텐데요...?
첫번째 이미지 height <?= $size[0][1] ?>
두번째 이미지 height <?= $size[1][1] ?>
세번째 이미지 height <?= $size[2][1] ?>
네번째 이미지 height <?= $size[3][1] ?>
...
key 부분을 변경한다는 게, 어떤 걸 애기하시는지 잘 모르겠네요...
근데 이미지를 클릭하면 첨부되는 걸 가져오는지라, height="<?= $size[$i][1] ?> 이런 식으로 적용을 하려면
어떻게 해야 될지 막막하긴 하네요 ㅎㅎ..
글이 잘 이해가 안가지만..
view에서는 이미지파일을 한번 리사이징합니다.
board를 설정하는 페이지에서 view페이지의 이미지 크기를 입력하면 그 사이즈로 조절되는 거죠
하여.. 현재불러오는 사이즈는 네이티브한 사이즈이고
실제 게시판은 다시 리사이즈한 사이즈가 적용되어있죠..
<td width="800" height="<?= $size[1] ?>" Style="background:#fff;"><img src="<?=$list[0][file][0][path]?>/<?=$list[0][file][1][file]?>" width="800" height="<?= $size[1] ?>" id="main_img"></td>
여기서 이미지들이 유동적이다보니 그냥 이미지 원사이즈를 적용하겠다는 거구요. 뷰페이지로 전환되서 하는 게 아니라 리사이즈는 아직 적용안됩니다.
답변을 작성하시기 전에 로그인 해주세요.
