source: ether_statistics/web/resources/js/library/jquery-ui-1.9.0.custom/development-bundle/demos/spinner/latlong.html @ 622

Last change on this file since 622 was 622, checked in by vmipsl, 12 years ago

wijmo
File size: 1.4 KB
Line 
1<!doctype html>
2<html lang="en">
3<head>
4        <meta charset="utf-8">
5        <title>jQuery UI Spinner - Map</title>
6        <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
7        <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
8        <script src="../../jquery-1.8.2.js"></script>
9        <script src="../../external/jquery.mousewheel.js"></script>
10        <script src="../../ui/jquery.ui.core.js"></script>
11        <script src="../../ui/jquery.ui.widget.js"></script>
12        <script src="../../ui/jquery.ui.button.js"></script>
13        <script src="../../ui/jquery.ui.spinner.js"></script>
14        <link rel="stylesheet" href="../demos.css">
15        <script>
16        $(function() {
17                function latlong() {
18                        return new google.maps.LatLng( $("#lat").val(), $("#lng").val() );
19                }
20                function position() {
21                        map.setCenter( latlong() );
22                }
23                $( "#lat, #lng" ).spinner({
24                        step: .001,
25                        change: position,
26                        stop: position
27                });
28
29                var map = new google.maps.Map( $("#map")[0], {
30                        zoom: 8,
31                        center: latlong(),
32                        mapTypeId: google.maps.MapTypeId.ROADMAP
33                });
34        });
35        </script>
36        <style>
37        #map {
38                width:500px;
39                height:500px;
40        }
41        </style>
42</head>
43<body>
44
45<label for="lat">Latitude</label>
46<input id="lat" name="lat" value="44.797">
47<br>
48<label for="lng">Longitude</label>
49<input id="lng" name="lng" value="-93.278">
50
51<div id="map"></div>
52
53<div class="demo-description">
54<p>Google Maps integration, using spinners to change latidude and longitude.</p>
55</div>
56</body>
57</html>
Note: See TracBrowser for help on using the repository browser.