HTML5 Javascript issue

Question

I am having strange issue, I had developed an mobile application using HTML5, it is working fine in Android phones but it is not working in iPhone, the javascript is completely ignored in all iPhones, in iPhone Javascript is enabled but still not working.

This is the site that I developed http://trafficticket.net23.net/mobile.html I have another problem also, the site is NOT taking up 100% width of the screen in Android, in Viewport I had given like this

<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

<script type="text/javascript">
    var viewPortWidth = 1024;
    function setViewport() {
    if ((navigator.userAgent.toLowerCase().indexOf("android")!=-1)) {
        var wW0 = window.screen.width;
        var scale = wW0/viewPortWidth;
        var vPort = "width="+viewPortWidth+", maximum-scale="+scale+", minimum-scale="+scale+", initial-scale="+scale+", user-scalable=yes";
        document.getElementById("viewport").setAttribute("content", vPort);
    }
    }
    setViewport();
</script> 

But top strip is not taking up 100% width of the mobile screen.

What mistake I am doing ..

Answer 1

The if statement is excluding iPhones:

if ((navigator.userAgent.toLowerCase().indexOf("android")!=-1)) {

This will never be true on an iphone