2016년 10월 24일 월요일

[javascript]윈도우 창 줄이기

상황) 윈도우 새창을 고정값 px 로 띄운후 새창으로 뜬 윈도우에서 버튼 클릭시
html 특정영역만큼 사이즈 줄이기

문제점 window.open 을 통해 px 값을 엘리먼트 들이 가진 width 했을때
body width 에 딱맞는 innerWidth 를 가진 윈도우 창을 띄우지만
windows.resizeTo(넓이,높이) 함수를 이용 사이즈 변경시 전달한 파라미터 는 윈도우 innerWidth 가 전달된 넓이가 아닌 윈도우 창 자체 넓이가 넓이인 창을 띄우게되어
하단에 스크롤이 생긴다.

내가 전달한 엘리먼트 넓이를 딱 맞게 포함하는 윈도우를 띄워 스크롤이 안생기게 하고
싶을때

!!방법

resizeTo( 윈도우 창의 전체 크기 - 윈도우 내부크기 +  엘리먼트 크기  ,  높이)

높이도 마찬가지 일것같은데 난 일다높이는 고정을 해도 상관없는 상황이어서 넓이값만 조정함.


일단 소스

$("body > div.OpenChat_wrap > div.OpenChatContents > a").on("click",function(){
//윈도우 줄이기
if($(this).attr("win-status") == "show"){

... ( 생략 ) ...

        //위 선택자는 볼거 및 다른 거는 볼거 없고 내가 보여주고자 하는 엘리먼트의 넓이
        //를 width 란 변수에 셋팅
 
      var width = $("body > div.OpenChat_wrap > div.OpenChatContents >                         div.contentsR").css("width").replace("px","");

        // 텀 구하기
var widthTurm = (Number(window.outerWidth) -    Number(window.innerWidth));

       
window.resizeTo(Number(width) + Number(widthTurm),714);
//윈도우 늘리기
}else{

        ...( 생략 )...
var width = $("body > div.OpenChat_wrap").css("width").replace("px","");
var widthTurm = (Number(window.outerWidth) -                                                                             (Number(window.innerWidth));
window.resizeTo(Number(width) + Number(widthTurm),714);

}
});

결론
내가 변경하고 싶은 엘리먼트 넓이를 셋팅 하고 그 변경된 넓이를
with 변수에 저장하고 winodw.resizeTo 함수를 이용 스크롤이 생기지 않고 그부분만보이게끔 창크기를 줄이거나 늘린다.

크롬 익스 정상 작동


댓글 없음:

댓글 쓰기

[lunux]리눅스 폴더별 용량 확인

리눅스 폴더별 용량 확인 조회 하고자 하는 디렉토리 리스트가있는 경로로 이동후 du -h --max-depth=1