Notice
Recent Posts
Recent Comments
Link
«   2025/02   »
일 월 화 수 목 금 토
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28
Tags more
Archives
Today
Total
관리 메뉴

moozi

jquery ui map 예제 본문

하이브리드앱

jquery ui map 예제

moozi 2015. 12. 14. 14:53

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, width=device-width"/>
        <title>한국IT전문학교</title>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

        <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
   
       
        <!-- jquery ui map (google map) 사용시 필요.  시작 -->
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="ui/min/jquery.ui.map.min.js"></script>
<script type="text/javascript" src="ui/jquery.ui.map.js"></script>
        <!-- jquery ui map (google map) 사용시 필요. 끝 ---->
           
 <script type="text/javascript">
    $(document).ready(
        function(){
            var LatLng=new google.maps.LatLng(37.474361, 127.030960);//위도.경도 객체 생성
            $("#map_canvas").gmap({"center":LatLng,"zoom":16});
           
        }
    );   
       
 </script>
       
     <style type="text/css">
         .map_style{
             padding:0px;
             height:100%;
             width:100%;            
         }   
   
       
    </style>
       
    </head>
    <body>
        <div data-role="page" class="map_style">
            <div data-role="header" data-position="fixed">
                <a href="index.html" data-icon="back">back</a>
                <a href="index.html" data-icon="home" data-iconpos="notext">홈</a>
               
                <h1>학교위치</h1>
               
               
            </div>
            <div data-role="content" class="map_style">
                <div id="map_canvas" class="map_style"></div>
             </div>
               
               
            </div>
        </div>
   
    </body>
</html>

'하이브리드앱' 카테고리의 다른 글

폰갭API 참고  (0) 2017.10.11
폰갭 빌드시 Can't accept license agreement Android SDK Platform 24 에러  (0) 2017.10.10
부트스트랩 예제  (0) 2015.11.06
iframe사용하기  (0) 2015.10.31
자바스크립트를 이용한 jsp의 json파싱  (0) 2015.10.29
'하이브리드앱' Related Articles more
Comments