갤러리 최근 게시물의 섬네일 > 그누4 질문답변

그누4 질문답변

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기
기존 게시물은 열람만 가능합니다.

갤러리 최근 게시물의 섬네일 정보

갤러리 최근 게시물의 섬네일

첨부파일

line_2.zip (18.4K) 8회 다운로드 2008-12-12 13:39:22

본문

며칠전에 다른분꼐서 질문을 올려주신적이 있었는데....저도 궁금해서 답변을 기다렸습니다만...
답이 없어 제가 다시한번 질문을 드립니다.


첨부파일은 제가 사용중인 갤러리 최신 게시물입니다

가장 마지막에 작성한 글의 이미지를 왼쪽에 썸네일로 보여주는데요..
이 섬네일을 마우스 오버시에 바뀔 수 있게 하는 방법을 알고 싶습니다.


temp.jpg


위의 그림에서 설명 한것 처럼...
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]?>");

추가해주시면 될거같은데.....제가 테스트 해보진 않아서 -_-;;
언젠가 작업했던 거네요. (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. 썸네일함수 : 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(~); ?>

이래야 충돌이 나지 않습니다...
© SIRSOFT
현재 페이지 제일 처음으로