Google maps and iPhone

I'm developing simple application for smart phones. It works everywhere except iPhone. Code is dead simple: js:

var initial_lat  = 58.3972;
var initial_lng  = 15.5776;
var initial_zoom = 15;
var map;

function initialize_map() {
    var initialLatLng = new google.maps.LatLng(initial_lat, initial_lng);

    var myOptions = {
        zoom: initial_zoom,
        center: initialLatLng,
        mapTypeControl: true,
        mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
        },
        navigationControl: true,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.BIG
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_block"), myOptions);
}

and HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd"&gt;

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt;
        <script type="text/javascript" src="resources/js/test.js"></script>


    </head>
    <body onload="initialize_map()">
        <div id="map_block" style="width:100%; height:480px;" ></div>
    </body>
</html>

It displays a map and big navigation controller for moving map - nothing special. It works everywhere except for iPhone. On iPhone, map is displayed correctly but you cant move it (drag and move) and the navigation controller(widget if you like) does not appear.

What am I missing?

ansaurus

tags:

views:

answers:

Google maps and iPhone

related questions