var map_detail; var radius_val = 50; var slider; var fullscreen_flag = 0; /*브라우저에서 플래시 10이상 설치가 안되있다면 로드뷰를 볼 수 없다*/ var flash_enable = false; if(swfobject.getFlashPlayerVersion().major >= 10){ flash_enable = true; } function set_radius(t){ radius_val = t; } /** * 매물 위치 표시 (google) */ function position_google(lat, lng) { lat = parseFloat(lat); lng = parseFloat(lng); var google_map = new google.maps.Map(document.getElementById('google_map'), { center: {lat: lat, lng: lng}, zoom: 16, panControl : false, linksControl: false, zoomControl : true, enableCloseButton: false, scrollwheel : false, streetViewControl : true, mapTypeControlOptions: { position: google.maps.ControlPosition.LEFT_TOP }, zoomControlOptions: { style: google.maps.ZoomControlStyle.LARGE, position: google.maps.ControlPosition.RIGHT_TOP }, streetViewControlOptions: { position: google.maps.ControlPosition.RIGHT_TOP } }); var circle = new google.maps.Circle({ strokeColor: '#75B8FA', strokeOpacity: 0.8, strokeWeight: 2, fillColor: '#CFE7FF', fillOpacity: 0.35, map: google_map, center: {lat: lat, lng: lng}, radius: radius_val }); } /** * 매물 위치 표시 (daum) */ function position_daum(lat, lng, level, maxzoom) { var container = document.getElementById('container'), // 지도와 로드뷰를 감싸고 있는 div 입니다 mapWrapper = document.getElementById('mapWrapper'), // 지도를 감싸고 있는 div 입니다 btnRoadview = document.getElementById('btnRoadview'), // 지도 위의 로드뷰 버튼, 클릭하면 지도는 감춰지고 로드뷰가 보입니다 btnMap = document.getElementById('btnMap'), // 로드뷰 위의 지도 버튼, 클릭하면 로드뷰는 감춰지고 지도가 보입니다 rvContainer = document.getElementById('roadview'), // 로드뷰를 표시할 div 입니다 mapContainer = document.getElementById('point_map'); // 지도를 표시할 div 입니다 // 지도와 로드뷰 위에 마커로 표시할 특정 장소의 좌표입니다 var placePosition = new daum.maps.LatLng(lat, lng); // 지도 옵션입니다 var mapOption = { center: placePosition, // 지도의 중심좌표 level: level // 지도의 확대 레벨 }; // 지도를 표시할 div와 지도 옵션으로 지도를 생성합니다 map_detail = new daum.maps.Map(mapContainer, mapOption); // 일반 지도와 스카이뷰로 지도 타입을 전환할 수 있는 지도타입 컨트롤을 생성합니다 var mapTypeControl = new daum.maps.MapTypeControl(); // 지도에 컨트롤을 추가해야 지도위에 표시됩니다 // daum.maps.ControlPosition은 컨트롤이 표시될 위치를 정의하는데 TOPRIGHT는 오른쪽 위를 의미합니다 map_detail.addControl(mapTypeControl, daum.maps.ControlPosition.TOPRIGHT); // 지도 확대 축소를 제어할 수 있는 줌 컨트롤을 생성합니다 var zoomControl = new daum.maps.ZoomControl(); map_detail.addControl(zoomControl, daum.maps.ControlPosition.RIGHT); if(flash_enable){ // 로드뷰 객체를 생성합니다 var roadviewClient = new daum.maps.RoadviewClient(); var roadview = new daum.maps.Roadview(rvContainer); // 로드뷰의 위치를 특정 장소를 포함하는 파노라마 ID로 설정합니다 // 로드뷰의 파노라마 ID는 Wizard를 사용하면 쉽게 얻을수 있습니다 roadviewClient.getNearestPanoId(placePosition, 50, function(panoId) { if(!panoId){ roadviewClient.getNearestPanoId(placePosition, 100, function(panoId) { roadview.setPanoId(panoId, placePosition); if(!panoId){ roadviewClient.getNearestPanoId(placePosition, 200, function(panoId) { roadview.setPanoId(panoId, placePosition); if(!panoId){ roadviewClient.getNearestPanoId(placePosition, 300, function(panoId) { roadview.setPanoId(panoId, placePosition); if(!panoId){ roadviewClient.getNearestPanoId(placePosition, 500, function(panoId) { roadview.setPanoId(panoId, placePosition); if(!panoId){ msg("success" ,"해당지역 근처에 로드뷰가 없습니다."); } }); } }); } }); } }); } roadview.setPanoId(panoId, placePosition); }); // 로드뷰 초기화가 완료되면 daum.maps.event.addListener(roadview, 'init', function() { // 로드뷰에 특정 장소를 표시할 마커를 생성하고 로드뷰 위에 표시합니다 /* var rvMarker = new daum.maps.Marker({ position: placePosition, map: roadview }); */ // 특정 장소가 잘보이도록 로드뷰의 적절한 시점(ViewPoint)을 설정합니다 // Wizard를 사용하면 적절한 로드뷰 시점(ViewPoint)값을 쉽게 확인할 수 있습니다 roadview.setViewpoint({ pan: 0, tilt: 0, zoom: 0 }); }); } if(radius_val>0){ // 원반경 기준으로 랜덤 좌표를 얻고 중심을 이동시킵니다. var coef = radius_val * 0.0000089; var prev_lat = parseFloat(lat) + coef; var prev_long = parseFloat(lng) + coef / Math.cos(lat * 0.018); var next_lat = parseFloat(lat) - coef; var next_long = parseFloat(lng) - coef / Math.cos(lat * 0.018); var random_lat = (Math.random() * (next_lat - prev_lat) + prev_lat).toFixed(14); var random_lng = (Math.random() * (next_long - prev_long) + prev_long).toFixed(14); map_detail.setCenter(new daum.maps.LatLng(random_lat, random_lng)); // 지도에 표시할 원을 생성합니다 var circle = new daum.maps.Circle({ center : new daum.maps.LatLng(random_lat, random_lng), // 원의 중심좌표 입니다 radius: radius_val, // 미터 단위의 원의 반지름입니다 strokeWeight: 5, // 선의 두께입니다 strokeColor: '#75B8FA', // 선의 색깔입니다 strokeOpacity: 1, // 선의 불투명도 입니다 1에서 0 사이의 값이며 0에 가까울수록 투명합니다 strokeStyle: 'dashed', // 선의 스타일 입니다 fillColor: '#CFE7FF', // 채우기 색깔입니다 fillOpacity: 0.7 // 채우기 불투명도 입니다 }); // 지도에 원을 표시합니다 circle.setMap(map_detail); } // 마우스휠로 자동 확대 축소 안되게 하기 map_detail.setZoomable(false); /*지도에 다음 카테고리 표시 시작*/ var placeOverlay = new daum.maps.CustomOverlay({zIndex:1}), contentNode = document.createElement('div'), // 커스텀 오버레이의 컨텐츠 엘리먼트 입니다 markers = [], // 마커를 담을 배열입니다 currCategory = ''; // 현재 선택된 카테고리를 가지고 있을 변수입니다 var ps = new daum.maps.services.Places(map_detail); daum.maps.event.addListener(map_detail, 'idle', searchPlaces); contentNode.className = 'placeinfo_wrap'; addEventHandle(contentNode, 'mousedown', daum.maps.event.preventMap); addEventHandle(contentNode, 'touchstart', daum.maps.event.preventMap); placeOverlay.setContent(contentNode); addCategoryClickEvent(); function addEventHandle(target, type, callback) { if (target.addEventListener) { target.addEventListener(type, callback); } else { target.attachEvent('on' + type, callback); } } // 카테고리 검색을 요청하는 함수입니다 function searchPlaces() { if (!currCategory) { return; } // 커스텀 오버레이를 숨깁니다 placeOverlay.setMap(null); // 지도에 표시되고 있는 마커를 제거합니다 removeMarker(); ps.categorySearch(currCategory, placesSearchCB, {useMapBounds:true}); } // 장소검색이 완료됐을 때 호출되는 콜백함수 입니다 function placesSearchCB( data, status, pagination ) { if (status === daum.maps.services.Status.OK) { // 정상적으로 검색이 완료됐으면 지도에 마커를 표출합니다 displayPlaces(data); } else if (status === daum.maps.services.Status.ZERO_RESULT) { // 검색결과가 없는경우 해야할 처리가 있다면 이곳에 작성해 주세요 } else if (status === daum.maps.services.Status.ERROR) { // 에러로 인해 검색결과가 나오지 않은 경우 해야할 처리가 있다면 이곳에 작성해 주세요 } } // 지도에 마커를 표출하는 함수입니다 function displayPlaces(places) { // 몇번째 카테고리가 선택되어 있는지 얻어옵니다 // 이 순서는 스프라이트 이미지에서의 위치를 계산하는데 사용됩니다 // var order = document.getElementById(currCategory).getAttribute('data-order'); var order = $('#category_icon > li.on').data('order'); for ( var i=0; i<places.length; i++ ) { // 마커를 생성하고 지도에 표시합니다 var marker = addMarker(new daum.maps.LatLng(places[i].y, places[i].x), order); // 마커와 검색결과 항목을 클릭 했을 때 // 장소정보를 표출하도록 클릭 이벤트를 등록합니다 (function(marker, place) { daum.maps.event.addListener(marker, 'click', function() { displayPlaceInfo(place); }); })(marker, places[i]); } } // 마커를 생성하고 지도 위에 마커를 표시하는 함수입니다 function addMarker(position, order) { if(order=='MT1'){ var imageSrc = '/assets/common/img/map_icon/mt1_o.png'; } else if(order=='CS2'){ var imageSrc = '/assets/common/img/map_icon/cs2_o.png'; } else if(order=='PS3'){ var imageSrc = '/assets/common/img/map_icon/ps3_o.png'; } else if(order=='SC4'){ var imageSrc = '/assets/common/img/map_icon/sc4_o.png'; } else if(order=='BK9'){ var imageSrc = '/assets/common/img/map_icon/bk9_o.png'; } else if(order=='CT1'){ var imageSrc = '/assets/common/img/map_icon/ct1_o.png'; } else if(order=='PO3'){ var imageSrc = '/assets/common/img/map_icon/po3_o.png'; } else if(order=='AT4'){ var imageSrc = '/assets/common/img/map_icon/at4_o.png'; } else if(order=='HP8'){ var imageSrc = '/assets/common/img/map_icon/hp8_o.png'; } else if(order=='PM9'){ var imageSrc = '/assets/common/img/map_icon/pm9_o.png'; } var imageSrc = imageSrc, // 마커 이미지 url, 스프라이트 이미지를 씁니다 imageSize = new daum.maps.Size(27, 28), // 마커 이미지의 크기 imgOptions = { spriteSize : new daum.maps.Size(27, 28), // 스프라이트 이미지의 크기 spriteOrigin : new daum.maps.Point(10, (order*36)), // 스프라이트 이미지 중 사용할 영역의 좌상단 좌표 offset: new daum.maps.Point(2, 72) // 마커 좌표에 일치시킬 이미지 내에서의 좌표 }, markerImage = new daum.maps.MarkerImage(imageSrc, imageSize, imgOptions), marker = new daum.maps.Marker({ position: position, // 마커의 위치 image: markerImage }); marker.setMap(map_detail); // 지도 위에 마커를 표출합니다 markers.push(marker); // 배열에 생성된 마커를 추가합니다 return marker; } // 지도 위에 표시되고 있는 마커를 모두 제거합니다 function removeMarker() { for ( var i = 0; i < markers.length; i++ ) { markers[i].setMap(null); } markers = []; } // 클릭한 마커에 대한 장소 상세정보를 커스텀 오버레이로 표시하는 함수입니다 function displayPlaceInfo (place) { var content = '<div class="placeinfo">' + ' <a class="title" href="' + place.placeUrl + '" target="_blank" title="' + place.title + '">' + place.title + '</a>'; if (place.newAddress) { content += ' <span title="' + place.newAddress + '">' + place.newAddress + '</span>' + ' <span class="jibun" title="' + place.address + '">(지번 : ' + place.address + ')</span>'; } else { content += ' <span title="' + place.address + '">' + place.address + '</span>'; } content += ' <span class="tel">' + place.phone + '</span>' + '</div>' + '<div class="after"></div>'; contentNode.innerHTML = content; placeOverlay.setPosition(new daum.maps.LatLng(place.latitude, place.longitude)); placeOverlay.setMap(map_detail); } // 각 카테고리에 클릭 이벤트를 등록합니다 function addCategoryClickEvent() { var category = document.getElementById('category_icon'); if(category){ children = category.children; for (var i=0; i<children.length; i++) { children[i].onclick = onClickCategory; } } } // 카테고리를 클릭했을 때 호출되는 함수입니다 function onClickCategory() { var id = $(this).data('key'), className = this.className; placeOverlay.setMap(null); if (className === 'on') { currCategory = ''; changeCategoryClass(); removeMarker(); } else { currCategory = id; changeCategoryClass(this); searchPlaces(); } } // 클릭된 카테고리에만 클릭된 스타일을 적용하는 함수입니다 function changeCategoryClass(el) { var category = document.getElementById('category_icon'), children = category.children, i; for ( i=0; i<children.length; i++ ) { children[i].className = ''; } if (el) { el.className = 'on'; } } /*지도에 다음 카테고리 표시 끝*/ } // 다음지도와 로드뷰를 감싸고 있는 div의 class를 변경하여 지도를 숨기거나 보이게 하는 함수입니다 function toggleMap(active) { if (active) { // 지도가 보이도록 지도와 로드뷰를 감싸고 있는 div의 class를 변경합니다 container.className = "view_map"; } else { if(flash_enable){ // 지도가 숨겨지도록 지도와 로드뷰를 감싸고 있는 div의 class를 변경합니다 container.className = "view_roadview"; } else { msg("error","Flash 10 이상이 설치 되어야 로드뷰를 볼 수 있습니다."); } } } function refresh(){ if(map_detail!=null && map_detail!="undefined"){ map_detail.relayout(); } } /** * 관심으로 등록하기 */ function hope(id){ open_leanModal("#signin"); return false; $.get("/product/hope_action/"+id+"/"+Math.round(new Date().getTime()),function(data){ if(data=="1"){ if("basic"=="reales"){ $(".hope_count").text(parseInt($(".hope_count").text())+1); msg("success" ,"회원로그인 시 영구저장됩니다."); hope_list_refresh(); } else{ msg("success" ,"회원로그인 시 영구저장됩니다."); } } else if(data=="2"){ msg("success" ,"로그인 후 이용가능 합니다."); } else { msg("success" ,"이미 찜 하였습니다."); } }); } function hope_installation(id){ $.get("/installation/hope_action/"+id+"/"+Math.round(new Date().getTime()),function(data){ if(data=="1"){ if("basic"=="reales"){ $(".hope_count").text(parseInt($(".hope_count").text())+1); msg("success" ,"회원로그인 시 영구저장됩니다."); hope_list_refresh(); } else{ msg("success" ,"회원로그인 시 영구저장됩니다."); } } else { msg("success" ,"이미 찜 하였습니다."); } }); } function hope_list_refresh(){ $.getJSON("/hope/get_json_list/"+Math.round(new Date().getTime()),function(data){ var str = ''; if(data){ $.each(data, function(key, val) { str += '<li>'; str += ' <a href="#" class="view_product" data-id="'+val["id"]+'" data-toggle="modal" data-target="#view_dialog">'; str += ' <img class="avatar pull-left" src="/photo/gallery_thumb/'+val["gallery_id"]+'/'+val["gallery_st_id"]+'" alt="avatar">'; str += ' <div class="pulse border-grey"></div>'; str += ' <div class="notify pull-left">'; str += ' <div class="notifyName">'+val["title"]+'</div>'; str += ' <div class="notifyTime"><i class="icon-pointer"></i> '+val["address_name"]+'</div>'; str += ' </div>'; str += ' <div class="clearfix"></div>'; str += ' </a>'; str += '</li>'; }); $("#hope_list").html(str); } }); } function local(code,lat,lng){ $.getJSON("/product/local/"+lat+"/"+lng+"/"+code+"/"+Math.round(new Date().getTime()),function(data){ if(data){ $.each(data, function(key, val) { if(key=="documents"){ var str = "<table class='border-table'><tr><th>장소명</th><th>거리</th><th class='hidden-xs'>주소</th><th>전화번호</th></tr>"; if(val.length<1){ str += "<tr><td colspan='4'>자료가 없습니다.</td></tr>"; } else { $.each(val, function(key1, val1) { phone = ""; if(val1["phone"]!=""){ phone = "<a href='tel:"+val1["phone"]+"'><i class='fa fa-phone-square mhidden'></i> " + val1["phone"] + "</a>"; } str += "<tr><td><b>"+val1["place_name"]+"</b></td><td> "+val1["distance"]+"m</td><td class='hidden-xs'><i class='fa fa-map-marker'></i>"+val1["address_name"]+"</td><td>" + phone + "</td></tr>"; }); } str +="</table>"; $("#"+code).html(str); } }); } }); } /** * 슬라이드 초기화 * p값이 0이면 gallery 썸네일이 하단, 1이면 썸네일이 우측에 위치하도록 한다. */ function view_init(p,modal){ //상세 540 , 모달 465 if(modal){ var gallery_height = 465; } else { var gallery_height = 540; } var gallery_thumbnail = "horizontal"; if(p=="1") { gallery_height = 400; gallery_thumbnail = "vertical"; } if(p=="2") { ctr='bullets'; global_caption=false; } else { ctr='thumbnails'; global_caption=true; } $(".royalSlider").height(gallery_height); /** * imageScaleMode : fill, fit, fit-if-smaller(Default), none */ $('#gallery-1').css('display', 'block').royalSlider({ fullscreen: { enabled: true, nativeFS: false}, controlNavigation: ctr, transitionType : 'fade', autoPlay: { enabled: false, pauseOnHover: true, delay: 5000 }, autoScaleSlider: false, autoScaleSliderHeight: gallery_height, loop: true, imageAlignCenter:true, navigateByClick: false, numImagesToPreload:2, arrowsNav:true, arrowsNavAutoHide: true, arrowsNavHideOnTouch: true, keyboardNavEnabled: true, fadeinLoadedSlide: true, globalCaption: global_caption, globalCaptionInside: false, thumbs: { orientation: gallery_thumbnail, appendSpan: true, firstMargin: true, paddingBottom: 4 }, sliderTouch: true, imageScaleMode: function(slideObject) { if(fullscreen_flag>0){ return 'fit-if-smaller'; } else { if( slideObject.iH > slideObject.iW){ return 'fit-if-smaller'; } else { return 'fill'; } } } }); var si = $('#gallery-full').royalSlider({ fullscreen: { enabled: true, nativeFS: true }, addActiveClass: true, arrowsNav: false, controlNavigation: 'none', imageScaleMode: "fit-if-smaller", autoScaleSlider: true, autoScaleSliderWidth: 1200, autoScaleSliderHeight: 400, loop: true, fadeinLoadedSlide: false, globalCaption: false, keyboardNavEnabled: true, globalCaptionInside: false, visibleNearby: { enabled: true, centerArea: 0.5, center: true, breakpoint: 650, breakpointCenterArea: 0.64, navigateByCenterClick: true } }).data('royalSlider'); $('#concern_simple_form').ajaxForm({ beforeSubmit : function(){ if($('#concern_simple_form').find("#phone").val()==""){ msg("error" ,"전화번호를 입력해 주세요"); return false; } if($('#concern_simple_form').find("input[name='privacy_chk']:checked").val() != "1"){ msg("error" ,"개인정보 수집이용 동의 필수입력입니다."); return false; } }, success:function(data){ if(data == "1"){ msg("success" ,"등록성공입니다."); } else { msg("error" ,"오류가 발생했습니다"); } } }); $('#concern_form').ajaxForm({ beforeSubmit : function(){ if($('#concern_form').find("#phone").val()==""){ msg("error" ,"전화번호를 입력해 주세요"); return false; } if(!$('#concern_form').find("#concern_agree").prop("checked")){ msg("error" ,"개인정보처리방침에 동의해주시기 바랍니다."); return false; } }, success:function(data){ if(data == "1"){ msg("success" ,"등록성공입니다."); } else { msg("error" ,"오류가 발생했습니다"); } } }); $('#htab').easyResponsiveTabs({ type: 'default', //Types: default, vertical, accordion width: 'auto', //auto or any width like 600px fit: true, // 100% fit in a container tabidentify: 'hor_1', // The tab groups identifier activate: function(event) { // Callback function if tab is switched local($(this).find("a").attr("data-key"),$(this).find("a").attr("data-lat"),$(this).find("a").attr("data-lng")); } }); /* 문의나 예약을 선택하면 로그가 쌓이도록 한다. */ $(".concern_product").click(function(){ var id = $(this).attr("data-id"); var call_view = $(this).attr("data-call-view"); if( $(this).attr("data-type")=="detail_address"){ $(".detail_address").show(); } else { $(".detail_address").hide(); } if($('input[name="privacy_chk"]:radio:checked').val()=="1"){ $("#target_url").attr("src","/product/view_log/?id="+id); } if(call_view=="1"){ $.get("/product/add_call_view/"+id+"/"+$(this).attr("data-member-id")+"/"+Math.round(new Date().getTime()),function(data){ }); } }); $("#request_call").click(function(){ $(".member").fadeIn(0500) }); $(".memberClose").click(function(){ $(".member").fadeOut("normal"); }); /*** * gallery를 정의합니다. * 1. 동영상이 플레이되고 있을 경우에는 마우스오버로 페이지이동이 되지 않지만 플레이가 되고 있지 않을 경우에는 페이지 이동이 된다. * 2. 만약 360도 파노라마가 플레이되고 있을 경우에는 마우스오버로 이동되는 기능이 동작하지 않도록 한다. **/ var video_playing = false; slider = $('#gallery-1').data('royalSlider'); try{ slider.ev.on('rsVideoPlay', function() { video_playing = true; }); slider.ev.on('rsVideoStop', function() { video_playing = false; }); video_playing = true; if($("#panorama_frame").length == 0 && $(".360").length == 0){ $(".rsNavItem").mouseover(function() { if(!video_playing){ $('.royalSlider').royalSlider('goTo', $(this).index() ); } }); } slider.ev.on('rsAfterSlideChange', function() { var zoom_360 = 65; $(".360").each(function(){ init($(this).attr("id"),"/photo/gallery_image/"+$(this).attr("gallery-id")+"/"+$(this).attr("st-id"),zoom_360); }); $(".loading360").fadeOut(); }); $(".rsFullscreenIcn").click(function(){ slider_fullscreen(); }); slider.ev.on('rsSlideClick', function () { if($('.rsTmb:eq('+slider.currSlideId+')').data('link')){ window.open($('.rsTmb:eq('+slider.currSlideId+')').data('link'), "", "width=1120,height=800"); return flase; } if(!slider.isFullscreen && panorama_flag==0){ slider.enterFullscreen(); /** slider_fullscreen(); **/ } }); slider.ev.on('rsEnterFullscreen', function() { fullscreen_flag = 1; $(".rsFullscreenIcn").html("<img src='/assets/plugin/royalslider/x.png'/>").css("background","none"); $(".rsArrowLeft > .rsArrowIcn").html("<img src='/assets/plugin/royalslider/left.png'/>").css("background","none"); $(".rsArrowRight > .rsArrowIcn").html("<img src='/assets/plugin/royalslider/right.png'/>").css("background","none"); $(".rsFullscreenBtn").css("right","20px"); $(".rsArrowRight").css("right","20px"); slider.st.autoScaleSliderWidth= 900; slider.updateSliderSize(true); }); slider.ev.on('rsExitFullscreen', function() { fullscreen_flag = 0; slider.st.autoScaleSliderWidth= 900; slider.st.autoScaleSliderHeight= 580; slider.st.imageScalePadding = 0; $(".rsFullscreenIcn").html("").css("background",""); $(".rsArrowLeft > .rsArrowIcn").html("").css("background",""); $(".rsArrowRight > .rsArrowIcn").html("").css("background",""); $(".rsFullscreenBtn").css("right","0px"); $(".rsArrowRight").css("right","0px"); slider.updateSliderSize(true); }); } catch (exception) { } $(".btn.py").click(function(){ var str = $(this).prev().text(); $(this).prev().text($(this).data("py")); $(this).data("py",str); }); } function slider_fullscreen(){ setTimeout(function(){ resize(); }, 100); if(!slider.isFullscreen || slider.isFullscreen==undefined){ } else{ } } function init_360(){ var zoom_360 = 65; if($(".360").length > 0){ $(".360").each(function(){ init($(this).attr("id"),"/photo/gallery_image/"+$(this).attr("gallery-id")+"/"+$(this).attr("st-id"),zoom_360); }); animate(); } } function slider_fullscreen_btn() { setTimeout(function(){ resize(); }, 100); if (slider && (!slider.isFullscreen || slider.isFullscreen == undefined)) { // Fullscreen 모드로 전환하는 로직 slider.enterFullscreen(); slider.isFullscreen = true; console.log('Entering fullscreen mode'); } else { // Fullscreen 모드를 종료하는 로직 slider.exitFullscreen(); slider.isFullscreen = false; console.log('Exiting fullscreen mode'); } } function enterFullscreen() { var elem = document.documentElement; if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.mozRequestFullScreen) { // Firefox elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullscreen) { // Chrome, Safari and Opera elem.webkitRequestFullscreen(); } else if (elem.msRequestFullscreen) { // IE/Edge elem.msRequestFullscreen(); } } function exitFullscreen() { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.mozCancelFullScreen) { // Firefox document.mozCancelFullScreen(); } else if (document.webkitExitFullscreen) { // Chrome, Safari and Opera document.webkitExitFullscreen(); } else if (document.msExitFullscreen) { // IE/Edge document.msExitFullscreen(); } }