뷰페이지에서 이미지 새창 관련
본문
안녕하세요 오랜만에 질문 올립니다.
뷰페이지에서 보통 썸네일 이미지 클릭하면
$v_img_count = count($view['file']);
if($v_img_count) {
echo "<div id=\"bo_v_img\">\n";
echo get_file_thumbnail($view['file'][0]);
echo "</div>\n";
}
원본 이미지 윈도우 새창열리는데요
뷰페이지에서 보통 어떻게 정의 되어있을까요?
창이 원본이미지 보 작아서 이미지에 맞게 창을 열고 싶은데요.
모달 박스나 나이트박스를 새로 적용해야하나요? , 그냥 윈도우 새창열리는데 이창을 수정을 하고 싶은데....못찾겠어요--;; 조언좀 부탁드리겠습니다.
답변 3
다음과 같은 방법으로 해결을 할 수 있지 않을까 합니다.
팝업 창을 띄우는 JavaScript 함수를 정의
<script>
function openImagePopup(imageUrl) {
var width = 800; // 원하는 팝업 창 너비
var height = 600; // 원하는 팝업 창 높이
var left = (screen.width - width) / 2;
var top = (screen.height - height) / 2;
var options = 'width=' + width + ',height=' + height + ',top=' + top + ',left=' + left;
window.open(imageUrl, 'ImagePopup', options);
}
</script>
썸네일 이미지가 클릭될 때 openImagePopup 함수를 호출하도록 수정
$v_img_count = count($view['file']);
if($v_img_count) {
echo "<div id=\"bo_v_img\">\n";
// 첫 번째 이미지만 출력
$thumbnailUrl = get_file_thumbnail($view['file'][0]);
echo "<a href=\"javascript:void(0);\" onclick=\"openImagePopup('$thumbnailUrl');\">\n";
echo "<img src=\"$thumbnailUrl\" alt=\"Thumbnail Image\">\n";
echo "</a>\n";
echo "</div>\n";
}
width와 height 변수를 원하는 팝업 창 크기로 조정하실 수 있으며, 팝업 창의 위치도 left와 top 변수를 조정하여 원하는 위치로 설정 하시면 됩니다.
참고하셔서 원하시는 형태로 구현하시면 될 것 같습니다.
/bbs/view_image.php에 보시면 이미지크기에 따라서 새창이 리사이징되는 스크립트가 있습니다. 이부분 수정하시면 될거같아요
https://gnustudy.com/bbs/board.php?bo_table=gnu_tip&wr_id=13
/lib/common.lib.php 파일에서 주석 처리.
if (preg_match("/\.({$config['cf_image_extension']})$/i", $file) && isset($board['bo_table'])) {
$attr_href = run_replace('thumb_view_image_href', G5_BBS_URL.'/view_image.php?bo_table='.$board['bo_table'].'&fn='.urlencode($file), $file, $board['bo_table'], $width, $height, $content);
// $img = '<a href="'.$attr_href.'" target="_blank" class="view_image">';
$img .= '<img src="'.G5_DATA_URL.'/file/'.$board['bo_table'].'/'.urlencode($file).'" alt="'.$content.'" '.$attr.'>';
// $img .= '</a>';
return $img;
}
