인터넷정보

[JS] 홈페이지 확대 축소

알 수 없는 사용자 2007. 12. 4. 09:54
http://www.software.or.kr/
이곳 들여다보다 보니 오른쪽 스크롤 배너에 확대 축소 버턴이 있어서 스크립을 들여다 봤떠니..
   
var nowZoom = 100; // 현재비율
document.body.style.zoom = nowZoom + "%";

식으로....

확대 축소를 하고있네요..

100%가 기본사이즈고  축소 확대할때 +10 이나 -10 을 해서 페이지 자체 사이즈를 바꾸고 있네요..


저처럼 모르고 있었던 사람 있을려나 해서....
1원짜리팁입니다.


아래는 실제 스크립트 입니다.


<!-- 화면 확대 축소 시작 IE 전용 --->
<!--
var nowZoom = 100; // 현재비율
var maxZoom = 200; // 최대비율(500으로하면 5배 커진다)
var minZoom = 80; // 최소비율

//화면 키운다.
function zoomIn()
{
    if (nowZoom < maxZoom)
    {
        nowZoom += 10; //25%씩 커진다.
    }
    else
    {
        return;
    }
    document.body.style.zoom = nowZoom + "%";
}


//화면 줄인다.
function zoomOut()
{
    if (nowZoom > minZoom)
    {
        nowZoom -= 10; //25%씩 작아진다.
    }
    else
    {
        return;
    }
    document.body.style.zoom = nowZoom + "%";
}

//화면 원래대로
function zoomDefault()
{
    nowZoom = 100;
    document.body.style.zoom = nowZoom + "%";
}
//-->
<!-- 화면 확대 축소 끝 --->


IE7에선 Ctrl 누른 상태에서 휠조정으로 가능합니다.
반응형