SIR
KCP 창업 지원, 수수료 국내최저 2.9% 제공 이벤트!

팝업 이미지 사이즈 문제

팝업 이미지 사이즈 문제

QA

팝업 이미지 사이즈 문제

본문

board 게시판 view.skin.php 이미지 클릭시 팝업에서 

창을 열면 데탑에서는 실사이즈가 뜨는데 

스마트폰에서는 X 처럼 길게 나와요 ... 그래서  

O 처럼 정이미지로 만들고 싶은데 뭘 고쳐야 하나요 ?

<반응형으로>3696790987_1603802354.1748.jpg

 

view_image.php 소스올려봅니다.

 


<?php
include_once('./_common.php');
$g5['title'] = '이미지 크게보기';
include_once(G5_PATH.'/head.sub.php');
$filename = preg_replace('/[^A-Za-z0-9 _ .\-\/]/', '', $_GET['fn']);
if(function_exists('clean_relative_paths')){
    $filename = clean_relative_paths($filename);
}
$extension = pathinfo($filename, PATHINFO_EXTENSION);
if ( ! preg_match('/(jpg|jpeg|png|gif|bmp)$/i', $extension) ){
    alert_close('이미지 확장자가 아닙니다.');
}
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;
}
$file_exists = (is_file($filepath) && file_exists($filepath)) ? 1 : 0;
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('이미지 파일이 아닙니다.');
    $width = (isset($size[0]) && $size[0]) ? (int) $size[0] : 0;
    $height = (isset($size[1]) && $size[1]) ? (int) $size[1] : 0;
    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);
    $img_attr = ($width && $height) ? 'width="'.$width.'" height="'.$height.'"' : '';
    $img = '<img src="'.$fileurl.'" alt="" '.$img_attr.' class="draggable" style="position:relative;top:0;left:0;cursor:move;">';
} else {
    alert_close('파일이 존재하지 않습니다.');
}
?>
<div class="bbs-view-image"><?php echo $img ?></div>
<script>
jQuery(function($){
$.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);
                });
            }
        }
    });
};
    $(".bbs-view-image img").imgLoad(function(){
        var win_w = <?php echo $width ?>;
        var win_h = <?php echo $height ?> + 70;
        if( !win_w || !win_h ){
            win_w = $(this).width();
            win_h = $(this).height();
        }
        var win_l = (screen.width - win_w) / 2;
        var win_t = (screen.height - win_h) / 2;
        if(win_w > screen.width) {
            win_l = 0;
            win_w = screen.width - 20;
            if(win_h > screen.height) {
                win_t = 0;
                win_h = screen.height - 40;
            }
        }
        if(win_h > screen.height) {
            win_t = 0;
            win_h = screen.height - 40;
            if(win_w > screen.width) {
                win_w = screen.width - 20;
                win_l = 0;
            }
        }
        window.moveTo(win_l, win_t);
        window.resizeTo(win_w, win_h);
    });
    var is_draggable = false;
    var x = y = 0;
    var pos_x = pos_y = 0;
    $(".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);
            pos_x = e.pageX;
            pos_y = e.pageY;
            $(this).css({ "left" : x, "top" : y });
        }
        return false;
    });
    $(".draggable").mousedown(function(e) {
        pos_x = e.pageX;
        pos_y = e.pageY;
        is_draggable = true;
        return false;
    });
    $(".draggable").mouseup(function() {
        is_draggable = false;
        return false;
    });
    $(".draggable").dblclick(function() {
        window.close();
    });
});
</script>
<?php
include_once(G5_PATH.'/tail.sub.php');
?>
이 글을 내 페이스북 계정으로 보내기 이 글을 내 트위터 계정으로 보내기

이 질문에 댓글 쓰기 :

답변 2

채택됨

eyekiss님의 답변

$img_attr = ($width && $height) ? 'width="'.$width.'" height="auto"' : '';

이렇게 수정하거나.. 삭제해보세요.

주소복사
채택됨
답변의 댓글

파아랑님의 답변

width만 100%로 잡고 height는 auto로 하시면 될것 같습니다. 

주소복사
답변의 댓글
답변을 작성하시기 전에 로그인 해주세요.
전체 43,126
고마운 분의 도움으로 질문을 해결하셨다면, 채택을 눌러서 감사의 마음을 전하세요.
어떻게 질문해야 할지 모른다면 질문하는 방법을 읽어 보신후 질문해 보세요.
QA 내용 검색

회원로그인

진행중 포인트경매

  1. 참여4 회 시작20.11.23 11:40 종료20.11.28 11:40
  2. 참여9 회 시작20.11.22 19:25 종료20.11.29 13:25

(주)에스아이알소프트 (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT