갤러리 최근 게시물의 섬네일 정보
갤러리 최근 게시물의 섬네일
첨부파일
본문
며칠전에 다른분꼐서 질문을 올려주신적이 있었는데....저도 궁금해서 답변을 기다렸습니다만...
답이 없어 제가 다시한번 질문을 드립니다.
첨부파일은 제가 사용중인 갤러리 최신 게시물입니다
가장 마지막에 작성한 글의 이미지를 왼쪽에 썸네일로 보여주는데요..
이 섬네일을 마우스 오버시에 바뀔 수 있게 하는 방법을 알고 싶습니다.
위의 그림에서 설명 한것 처럼...
1번 글의 섬네일만 나타나는데...
2번 3번글에 마우스를 올렸을때 섬네일이 바뀔 수 있게 하는 것이 궁금합니다.
고수분들의 도움을 기다립니다.
그럼 미리 감사드리며...^^
답이 없어 제가 다시한번 질문을 드립니다.
첨부파일은 제가 사용중인 갤러리 최신 게시물입니다
가장 마지막에 작성한 글의 이미지를 왼쪽에 썸네일로 보여주는데요..
이 섬네일을 마우스 오버시에 바뀔 수 있게 하는 방법을 알고 싶습니다.

위의 그림에서 설명 한것 처럼...
1번 글의 섬네일만 나타나는데...
2번 3번글에 마우스를 올렸을때 섬네일이 바뀔 수 있게 하는 것이 궁금합니다.
고수분들의 도움을 기다립니다.
그럼 미리 감사드리며...^^
댓글 전체
예로
썸네일 폴더가 thumb 이고 해당 파일이 wr_id 값이라고 했을때입니다..
이미지 아이디 값을 ch_img 로 주었습니다.
<img id=ch_img src="zz.gif">
<script language=Javascript>
function ch_img(idx)
{
document.getElementById("ch_img").src="<?=$g4[path]?>/data/file/<?=$bo_table?>/thumb/"+idx;
}
</script>
해당 서브젝트 부분($list[$i][subject]) 의 앵커태그에 onmouseover=ch_img("<?=$list[wr_id]?>");
추가해주시면 될거같은데.....제가 테스트 해보진 않아서 -_-;;
썸네일 폴더가 thumb 이고 해당 파일이 wr_id 값이라고 했을때입니다..
이미지 아이디 값을 ch_img 로 주었습니다.
<img id=ch_img src="zz.gif">
<script language=Javascript>
function ch_img(idx)
{
document.getElementById("ch_img").src="<?=$g4[path]?>/data/file/<?=$bo_table?>/thumb/"+idx;
}
</script>
해당 서브젝트 부분($list[$i][subject]) 의 앵커태그에 onmouseover=ch_img("<?=$list[wr_id]?>");
추가해주시면 될거같은데.....제가 테스트 해보진 않아서 -_-;;
장관님 답변 주셔서 감사드립니다.
하지만ㅠㅠ 적용을 못하겠네요...제 실력으로는 어려운 듯 합니다.
하지만ㅠㅠ 적용을 못하겠네요...제 실력으로는 어려운 듯 합니다.
언젠가 작업했던 거네요. (http://www.selca.co.kr/)
1. 최신글스킨 : 파일을 만들어서 latest 폴더에 업로드
<script type="text/javascript">COUNT["<?php echo $bo_table; ?>"] = <?php echo count($list); ?>;</script>
<table width="334" border="0" cellspacing="0" cellpadding="0" align="center">
<tr height="26">
<td><img src="<?php echo $g4['path']; ?>/img/i_bullet.jpg" align="absmiddle"> <strong><?php echo $board['bo_subject']; ?></strong></td>
<td align="right" class="small" style="padding:7px 0 0 0;"><a href="<?php echo $g4['bbs_path']; ?>/board.php?bo_table=<?php echo $bo_table; ?>" onfocus="this.blur();" style="color:#969696;">더보기</a></td>
</tr>
<tr><td background="<?php echo $g4['path']; ?>/img/g_dot.jpg" colspan="2"></td></tr>
<tr><td height="10" colspan="2"></td></tr>
<tr><td height="104" colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="98" style="border:3px solid #EBEBEB;">
<?php for($i = 0; $i < count($list); $i++){ ?>
<div id="<?php echo "{$bo_table}_{$i}"; ?>" style="<?php if($i == 0) echo 'display:block;'; else echo 'display:none;'; ?>"><a href="<?php echo $list[$i]['href']; ?>" onfocus="this.blur();"><?php echo THUMB_NAIL("{$list[$i]['file']['0']['path']}/{$list[$i]['file']['0']['file']}", "{$g4['path']}/data/thumb/{$list[$i]['file']['0']['file']}.thumb", 98, 98); ?></a></div>
<?php } ?>
</td>
<td width="12"></td>
<td width="" valign="top" style="padding:3px 0 0 0;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<?php for($i = 0; $i < count($list); $i++){ ?>
<tr><td height="20"><img src="<?php echo $g4['path']; ?>/img/i_bullet.jpg" align="absmiddle"> <a href="<?php echo $list[$i]['href']; ?>" onmouseover="layer('<?php echo $bo_table; ?>', '<?php echo $i; ?>');" onfocus="this.blur();" style="color:#222222;"><?php echo str_replace('…', '..', $list[$i]['subject']) . $list[$i]['comment_cnt']; ?></a></td></tr>
<?php } ?>
</table>
</td>
</tr>
</table>
</td></tr>
</table>
스크립트파일 : common.js에 추가
var COUNT = new Array();
function layer(id, no)
{
for(var i = 0; i < COUNT[id]; i++)
{
document.getElementById(id + "_" + i).style.display = "none";
}
document.getElementById(id + "_" + no).style.display = "block";
return;
}
썸네일함수 : common.lib에 추가
function THUMB_NAIL($exist, $creat, $width, $height)
{
global $g4;
if(file_exists($exist) == true && in_array(strtolower(array_pop(explode('.', $exist))), array('gif', 'jpg', 'jpeg', 'png')) == true)
{
if(file_exists($creat) == false)
{
list($img['width'], $img['height'], $img['type']) = getimagesize($exist);
switch($img['type'])
{
case '1' :
$src['image'] = imagecreatefromgif($exist);
$dst['image'] = imagecreate($width, $height);
break;
case '2' :
$src['image'] = imagecreatefromjpeg($exist);
$dst['image'] = imagecreatetruecolor($width, $height);
break;
case '3' :
$src['image'] = imagecreatefrompng($exist);
$dst['image'] = imagecreatetruecolor($width, $height);
break;
}
$dst['color'] = imagecolorallocate($dst['image'], 255, 255, 255);
imagefilledrectangle($dst['image'], 0, 0, $width, $height, $dst['color']);
imagecopyresampled($dst['image'], $src['image'], 0, 0, 0, 0, $width, $height, $img['width'], $img['height']);
switch($img['type'])
{
case '1' :
imagegif($dst['image'], $creat);
break;
case '2' :
imagejpeg($dst['image'], $creat, 100);
break;
case '3' :
imagepng($dst['image'], $creat, 100);
break;
}
imagedestroy($src['image']);
imagedestroy($dst['image']);
}
$return = "<img src=\"{$creat}\">";
}
else
{
$return = "<img src=\"{$g4['path']}/img/p_null.jpg\">";
}
return $return;
}
1. 최신글스킨 : 파일을 만들어서 latest 폴더에 업로드
<script type="text/javascript">COUNT["<?php echo $bo_table; ?>"] = <?php echo count($list); ?>;</script>
<table width="334" border="0" cellspacing="0" cellpadding="0" align="center">
<tr height="26">
<td><img src="<?php echo $g4['path']; ?>/img/i_bullet.jpg" align="absmiddle"> <strong><?php echo $board['bo_subject']; ?></strong></td>
<td align="right" class="small" style="padding:7px 0 0 0;"><a href="<?php echo $g4['bbs_path']; ?>/board.php?bo_table=<?php echo $bo_table; ?>" onfocus="this.blur();" style="color:#969696;">더보기</a></td>
</tr>
<tr><td background="<?php echo $g4['path']; ?>/img/g_dot.jpg" colspan="2"></td></tr>
<tr><td height="10" colspan="2"></td></tr>
<tr><td height="104" colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="98" style="border:3px solid #EBEBEB;">
<?php for($i = 0; $i < count($list); $i++){ ?>
<div id="<?php echo "{$bo_table}_{$i}"; ?>" style="<?php if($i == 0) echo 'display:block;'; else echo 'display:none;'; ?>"><a href="<?php echo $list[$i]['href']; ?>" onfocus="this.blur();"><?php echo THUMB_NAIL("{$list[$i]['file']['0']['path']}/{$list[$i]['file']['0']['file']}", "{$g4['path']}/data/thumb/{$list[$i]['file']['0']['file']}.thumb", 98, 98); ?></a></div>
<?php } ?>
</td>
<td width="12"></td>
<td width="" valign="top" style="padding:3px 0 0 0;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<?php for($i = 0; $i < count($list); $i++){ ?>
<tr><td height="20"><img src="<?php echo $g4['path']; ?>/img/i_bullet.jpg" align="absmiddle"> <a href="<?php echo $list[$i]['href']; ?>" onmouseover="layer('<?php echo $bo_table; ?>', '<?php echo $i; ?>');" onfocus="this.blur();" style="color:#222222;"><?php echo str_replace('…', '..', $list[$i]['subject']) . $list[$i]['comment_cnt']; ?></a></td></tr>
<?php } ?>
</table>
</td>
</tr>
</table>
</td></tr>
</table>
스크립트파일 : common.js에 추가
var COUNT = new Array();
function layer(id, no)
{
for(var i = 0; i < COUNT[id]; i++)
{
document.getElementById(id + "_" + i).style.display = "none";
}
document.getElementById(id + "_" + no).style.display = "block";
return;
}
썸네일함수 : common.lib에 추가
function THUMB_NAIL($exist, $creat, $width, $height)
{
global $g4;
if(file_exists($exist) == true && in_array(strtolower(array_pop(explode('.', $exist))), array('gif', 'jpg', 'jpeg', 'png')) == true)
{
if(file_exists($creat) == false)
{
list($img['width'], $img['height'], $img['type']) = getimagesize($exist);
switch($img['type'])
{
case '1' :
$src['image'] = imagecreatefromgif($exist);
$dst['image'] = imagecreate($width, $height);
break;
case '2' :
$src['image'] = imagecreatefromjpeg($exist);
$dst['image'] = imagecreatetruecolor($width, $height);
break;
case '3' :
$src['image'] = imagecreatefrompng($exist);
$dst['image'] = imagecreatetruecolor($width, $height);
break;
}
$dst['color'] = imagecolorallocate($dst['image'], 255, 255, 255);
imagefilledrectangle($dst['image'], 0, 0, $width, $height, $dst['color']);
imagecopyresampled($dst['image'], $src['image'], 0, 0, 0, 0, $width, $height, $img['width'], $img['height']);
switch($img['type'])
{
case '1' :
imagegif($dst['image'], $creat);
break;
case '2' :
imagejpeg($dst['image'], $creat, 100);
break;
case '3' :
imagepng($dst['image'], $creat, 100);
break;
}
imagedestroy($src['image']);
imagedestroy($dst['image']);
}
$return = "<img src=\"{$creat}\">";
}
else
{
$return = "<img src=\"{$g4['path']}/img/p_null.jpg\">";
}
return $return;
}
딱 제가 원하는 형태로 싸이트 최근 게시물이 뽑혀 나오는군요...^^
하지만....
1. 썸네일함수 : common.lib에 추가하라시는 내용 잘 추가 했습니다.
2. 내용을 긁어 latest.skin.php를 만들고 적용해 보았는데....
일단 섬네일까지는 잘 만들어집니다. 그러나 여전히 마우스 오버했을 때 청춘님께서 보여준 싸이트와는 달리 섬네일이 바뀌지 않는군요...흑.
.......................라고 쓸려고 했으나...헤헤 성공했습니다 정말 감사드립니다.
<script type="text/javascript">
var COUNT = new Array();
function layer(id, no)
{
for(var i = 0; i < COUNT[id]; i++)
{
document.getElementById(id + "_" + i).style.display = "none";
}
document.getElementById(id + "_" + no).style.display = "block";
return;
}
</script>
이부분을 latest.skin.php 에 윗부분에 넣으니 되는군요.
다시한번 답변 감사드립니다.
하지만....
1. 썸네일함수 : common.lib에 추가하라시는 내용 잘 추가 했습니다.
2. 내용을 긁어 latest.skin.php를 만들고 적용해 보았는데....
일단 섬네일까지는 잘 만들어집니다. 그러나 여전히 마우스 오버했을 때 청춘님께서 보여준 싸이트와는 달리 섬네일이 바뀌지 않는군요...흑.
.......................라고 쓸려고 했으나...헤헤 성공했습니다 정말 감사드립니다.
<script type="text/javascript">
var COUNT = new Array();
function layer(id, no)
{
for(var i = 0; i < COUNT[id]; i++)
{
document.getElementById(id + "_" + i).style.display = "none";
}
document.getElementById(id + "_" + no).style.display = "block";
return;
}
</script>
이부분을 latest.skin.php 에 윗부분에 넣으니 되는군요.
다시한번 답변 감사드립니다.
참고사이트처럼 여러개의 최신글을 뽑아내려면,
스크립트를 latest.skin.php 내에 넣지 마시고 최신글스킨함수 위에 넣으세요.
<script>~<script>
<?php echo latest(~); ?>
...
<?php echo latest(~); ?>
이래야 충돌이 나지 않습니다...
스크립트를 latest.skin.php 내에 넣지 마시고 최신글스킨함수 위에 넣으세요.
<script>~<script>
<?php echo latest(~); ?>
...
<?php echo latest(~); ?>
이래야 충돌이 나지 않습니다...