팝업 이미지 사이즈 문제 채택완료
레몬파이
5년 전
조회 3,641
board 게시판 view.skin.php 이미지 클릭시 팝업에서
창을 열면 데탑에서는 실사이즈가 뜨는데
스마트폰에서는 X 처럼 길게 나와요 ... 그래서
O 처럼 정이미지로 만들고 싶은데 뭘 고쳐야 하나요 ?
<반응형으로>
view_image.php 소스올려봅니다.
</p>
<p><?php
include_once('./_common.php');</p>
<p>$g5['title'] = '이미지 크게보기';
include_once(G5_PATH.'/head.sub.php');</p>
<p>$filename = preg_replace('/[^A-Za-z0-9 _ .\-\/]/', '', $_GET['fn']);</p>
<p>if(function_exists('clean_relative_paths')){
$filename = clean_relative_paths($filename);
}</p>
<p>$extension = pathinfo($filename, PATHINFO_EXTENSION);</p>
<p>if ( ! preg_match('/(jpg|jpeg|png|gif|bmp)$/i', $extension) ){
alert_close('이미지 확장자가 아닙니다.');
}</p>
<p>if(strpos($filename, G5_DATA_DIR.'/editor')) {
$editor_file = strstr($filename, 'editor');
$filepath = G5_DATA_PATH.'/'.$editor_file;
} else if(strpos($filename, G5_DATA_DIR.'/qa')) {
$editor_file = strstr($filename, 'qa');
$filepath = G5_DATA_PATH.'/'.$editor_file;
} else {
$editor_file = '';
$filepath = G5_DATA_PATH.'/file/'.$bo_table.'/'.$filename;
}</p>
<p>$file_exists = (is_file($filepath) && file_exists($filepath)) ? 1 : 0;</p>
<p>if($file_exists = run_replace('exists_view_image', $file_exists, $filepath, $editor_file)) {
$size = $file_exists ? run_replace('get_view_imagesize', @getimagesize($filepath), $filepath, $editor_file) : array();
if(empty($size))
alert_close('이미지 파일이 아닙니다.');</p>
<p> $width = (isset($size[0]) && $size[0]) ? (int) $size[0] : 0;
$height = (isset($size[1]) && $size[1]) ? (int) $size[1] : 0;</p>
<p> if($editor_file)
$fileurl = run_replace('get_editor_content_url', G5_DATA_URL.'/'.$editor_file);
else
$fileurl = run_replace('get_file_board_url', G5_DATA_URL.'/file/'.$bo_table.'/'.$filename, $bo_table);</p>
<p> $img_attr = ($width && $height) ? 'width="'.$width.'" height="'.$height.'"' : '';</p>
<p> $img = '<img src="'.$fileurl.'" alt="" '.$img_attr.' class="draggable" style="position:relative;top:0;left:0;cursor:move;">';
} else {
alert_close('파일이 존재하지 않습니다.');
}
?></p>
<p><div class="bbs-view-image"><?php echo $img ?></div></p>
<p><script></p>
<p>jQuery(function($){</p>
<p>$.fn.imgLoad = function(callback) {
return this.each(function() {
if (callback) {
if (this.complete || /*for IE 10-*/ $(this).height() > 0) {
callback.apply(this);
}
else {
$(this).on('load', function(){
callback.apply(this);
});
}
}
});
};</p>
<p> $(".bbs-view-image img").imgLoad(function(){</p>
<p> var win_w = <?php echo $width ?>;
var win_h = <?php echo $height ?> + 70;</p>
<p> if( !win_w || !win_h ){
win_w = $(this).width();
win_h = $(this).height();
}</p>
<p> var win_l = (screen.width - win_w) / 2;
var win_t = (screen.height - win_h) / 2;</p>
<p> if(win_w > screen.width) {
win_l = 0;
win_w = screen.width - 20;</p>
<p> if(win_h > screen.height) {
win_t = 0;
win_h = screen.height - 40;
}
}</p>
<p> if(win_h > screen.height) {
win_t = 0;
win_h = screen.height - 40;</p>
<p> if(win_w > screen.width) {
win_w = screen.width - 20;
win_l = 0;
}
}</p>
<p> window.moveTo(win_l, win_t);
window.resizeTo(win_w, win_h);
});</p>
<p> var is_draggable = false;
var x = y = 0;
var pos_x = pos_y = 0;</p>
<p> $(".draggable").mousemove(function(e) {
if(is_draggable) {
x = parseInt($(this).css("left")) - (pos_x - e.pageX);
y = parseInt($(this).css("top")) - (pos_y - e.pageY);</p>
<p> pos_x = e.pageX;
pos_y = e.pageY;</p>
<p> $(this).css({ "left" : x, "top" : y });
}</p>
<p> return false;
});</p>
<p> $(".draggable").mousedown(function(e) {
pos_x = e.pageX;
pos_y = e.pageY;
is_draggable = true;
return false;
});</p>
<p> $(".draggable").mouseup(function() {
is_draggable = false;
return false;
});</p>
<p> $(".draggable").dblclick(function() {
window.close();
});
});
</script></p>
<p><?php
include_once(G5_PATH.'/tail.sub.php');
?></p>
<p>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
5년 전
$img_attr = ($width && $height) ? 'width="'.$width.'" height="auto"' : '';
이렇게 수정하거나.. 삭제해보세요.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
레몬파이
5년 전
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
감사합니다. 다음에 또 뵈요