게시판 리스트에서 이미지 클릭 시, 첨부된 파일을 보여주려고 합니다.
본문
게시판 리스트에서 이미지 클릭 시, 첨부된 이미지 파일을 팝업처럼 보여주려고 합니다.
첨부파일은 2개인데, 첫번째는 $img로 표시되고 2번재는 main_img에 표시가 됩니다.
맨처음 <img> 태그 클릭 시 main_img에서 게시글에 첨부된 파일을 표시해주려고 하는데,
view_img 함수는 저렇게 작동을 합니다.
저 함수에서 어떻게 처리해야 img를 눌러서 main_img에 첨부파일2번째가 정상적으로 표시가 될지
다른 분들의 조언 부탁드립니다.
첨부파일은 2개인데, 첫번째는 $img로 표시되고 2번재는 main_img에 표시가 됩니다.
<img src="{$img}" width='{$img_width}' height='{$img_height}' border="0" title="$title" style="border:0px solid #000000;cursor:pointer;" onClick="view_img('$img')">
<table width="750" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td width="710" height="200" Style="background:#fff;"><img src="<?=$list[0][file][0][path]?>/<?=$list[0][file][1][file]?>" width="710" height="3125" id="main_img"></td>
</tr>
</table>
맨처음 <img> 태그 클릭 시 main_img에서 게시글에 첨부된 파일을 표시해주려고 하는데,
function view_img(img){
document.getElementById("main_img").src = img;
}
view_img 함수는 저렇게 작동을 합니다.
저 함수에서 어떻게 처리해야 img를 눌러서 main_img에 첨부파일2번째가 정상적으로 표시가 될지
다른 분들의 조언 부탁드립니다.
답변 1
첨부파일 이미지를
<div onclick=view_img();>
원래이미지
</div>
<div id="hover" style="display:none;">
첨부이미지
</div>
이렇게해서 안보이게 한후에
<script>
function view_img(){
$("#hover").css("display","block");
}
</script>
이런방법도 있네요
답변을 작성하시기 전에 로그인 해주세요.