지도를 반응형으로 넣는 방법문의 드립니다. 채택완료
테마를 사용하고 있고요.(basic에서도 동일)
index.php 화면의 최신글 위에 카카오지도를 넣으려고 합니다.
지도를 넣다 보니 반응형으로 되지 않아서 반응형으로 만드는 방법을 문의 드립니다.
아래 처럼
고수님의 조언을 구합니다. 감사합니다.
define('_INDEX_', true);
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
if (G5_IS_MOBILE) {
include_once(G5_THEME_MOBILE_PATH.'/index.php');
return;
}
if(G5_COMMUNITY_USE === false) {
include_once(G5_THEME_SHOP_PATH.'/index.php');
return;
}
include_once(G5_THEME_PATH.'/head.php');
?>
var mapContainer = document.getElementById('map'), // 지도를 표시할 div
mapOption = {
center: new daum.maps.LatLng(35.85824, 128.63060), // 지도의 중심좌표
level: 3 // 지도의 확대 레벨
};
var map = new daum.maps.Map(mapContainer, mapOption);
// 마커가 표시될 위치입니다
var markerPosition = new daum.maps.LatLng(35.85824, 128.63060);
// 마커를 생성합니다
var marker = new daum.maps.Marker({
position: markerPosition
});
// 마커가 지도 위에 표시되도록 설정합니다
marker.setMap(map);
var iwContent = '
iwPosition = new daum.maps.LatLng(33.450701, 126.570667); //인포윈도우 표시 위치입니다
// 인포윈도우를 생성합니다
var infowindow = new daum.maps.InfoWindow({
position : iwPosition,
content : iwContent
});
infowindow.open(map, marker);
최신글
// 최신글
$sql = " select bo_table
from `{$g5['board_table']}` a left join `{$g5['group_table']}` b on (a.gr_id=b.gr_id)
where a.bo_device <> 'mobile' ";
if(!$is_admin)
$sql .= " and a.bo_use_cert = '' ";
$sql .= " order by b.gr_order, a.bo_order ";
$result = sql_query($sql);
for ($i=0; $row=sql_fetch_array($result); $i++) {
if ($i%2==1) $lt_style = "margin-left:20px";
else $lt_style = "";
?>
// 이 함수가 바로 최신글을 추출하는 역할을 합니다.
// 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수);
// 테마의 스킨을 사용하려면 theme/basic 과 같이 지정
echo latest('theme/test', $row['bo_table'], 5, 25);
?>
}
?>
include_once(G5_THEME_PATH.'/tail.php');
?>
답변 4개
</p><p><span style="color: rgb(72, 72, 72); font-family: Arial, 돋움, Dotum; font-size: 14.004px;"><div id="map" style="width:400px;</span> </p><p>
부분에서 width:100%;로 변경하시고,
div#map을 감싸는 부모 div 추가하셔서
해당 부모 div를 media로 분기하시면 됩니다.
댓글을 작성하려면 로그인이 필요합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인