title: webview android and javascript resize
body: <p>I've got a webview app that shows my website, 
  in my website i use a .JS file to resize all the images, text and other stuff based on mobile's height and width, but it doesn't resize well, i think that it is for the image that i show while Webview is loading because in my browser, it works correctly.</p>
  
  <p>this is my MainActivity.java</p>
  
  <pre><code>package com.makemyandroidapp.parsenotificationexample;
  
  
  import android.app.Activity;
  import android.content.Intent;
  import android.graphics.Bitmap;
  import android.net.Uri;
  import android.os.Bundle;
  import android.view.KeyEvent;
  import android.view.View;
  import android.webkit.WebView;
  import android.webkit.WebViewClient;
  import android.widget.ImageView;
  import android.widget.ProgressBar;
  import android.widget.TextView;
  import android.widget.VideoView;
  
  /*
   * Demo of creating an application to open any URL inside the application and clicking on any link from that URl
  should not open Native browser but  that URL should open in the same screen.
  
  - Load WebView with progress bar
   */
  public class MainActivity extends Activity {
      /** Called when the activity is first created. */
  
      WebView web;
      ImageView imageView1;
  
      @Override
      public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          setContentView(R.layout.activity_main);
  
  
          web = (WebView) findViewById(R.id.webview01);
          imageView1 = (ImageView) findViewById(R.id.imageView1);
  
          web.setWebViewClient(new myWebClient());
          web.getSettings().setJavaScriptEnabled(true);
          web.loadUrl("http://www.bestparty.altervista.org/Mobile/eventi.php");
      }
  
      public class myWebClient extends WebViewClient
      {
          @Override
          public void onPageStarted(WebView view, String url, Bitmap favicon) {
              // TODO Auto-generated method stub
              super.onPageStarted(view, url, favicon);
          }
  
          @Override
          public boolean shouldOverrideUrlLoading(WebView view, String url) {
                 if (url.startsWith("tel:")) { 
                     Intent intent = new Intent(Intent.ACTION_DIAL,
                             Uri.parse(url)); 
                     startActivity(intent); 
             }else if(url.startsWith("http:") || url.startsWith("https:")) {
                 view.loadUrl(url);
             }
             return true;
  
          }
  
          @Override
          public void onPageFinished(WebView view, String url) {
              // TODO Auto-generated method stub
              super.onPageFinished(view, url);
              imageView1.setVisibility(View.GONE);
  
          }
      }
  
      // To handle "Back" key press event for WebView to go back to previous screen.
      @Override
      public boolean onKeyDown(int keyCode, KeyEvent event)
      {
          if ((keyCode == KeyEvent.KEYCODE_BACK) &amp;&amp; web.canGoBack()) {
              web.goBack();
              return true;
          }
          return super.onKeyDown(keyCode, event);
      }
  }
  </code></pre>
  
  <p>and this is my activity_main.xml</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:orientation="vertical" &gt;
  
      &lt;ImageView
          android:id="@+id/imageView1"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_marginTop="46dp"
          android:src="@drawable/ic_launcher" /&gt;
  
      &lt;WebView
          android:id="@+id/webview01"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_weight="0.60" /&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p>and i've got another question, is there a way to show the image for a specific time?
  for example,
  after the page is loaded, show the image for other 10seconds?</p>
  
  <p><strong>EDIT</strong>
  i need that my file func.js works correctly here is it</p>
  
  <pre><code>$(document).ready( function(){
   if ($(window).width() &gt; 1001 &amp;&amp; $(window).width() &lt; 10000 ) 
      { 
       $("#menubar").css("font-size", ((($(window).height()*8)/100)));
       $(".fotoevento").css("height", ((($(window).height()*45)/100)));
       $(".fotoevento").css("width", ((($(window).height()*100)/100)));
        $(".pub").css("margin-left", ((($(window).height()*13)/100)));
        $(".testievento").css("font-size", ((($(window).width()*3)/100)));
        $("#footer").css("font-size", ((($(window).width()*1)/100)));
  
  
                //MOBILE
       $(".logonavig").css("height", ((($(window).height()*3)/100)));
       $(".logonavig").css("width", ((($(window).width()*19)/100)));
        $(".FB_pic_container").css("height", ((($(window).height()*45)/100)));
       $(".FB_pic_container").css("width", ((($(window).width()*100)/100)));
       $(".galleria").css("height", ((($(window).height()*45)/100)));
       $(".galleria").css("width", ((($(window).width()*100)/100)));
       }
  
  
  
   else if ($(window).width() &lt; 1000) 
      { 
       $("#menubar").css("font-size", ((($(window).height()*3)/100)));
       $(".fotoevento").css("height", ((($(window).height()*35)/100)));
       $(".fotoevento").css("width", ((($(window).width()*90)/100)));
        $(".pub").css("margin-left", ((($(window).height()*13)/100)));
        $(".testievento").css("font-size", ((($(window).width()*5)/100)));
        $(".imamgineeventocompleta").css("margin-top", ((($(window).height()*3)/100)));
        $("#footer").css("font-size", ((($(window).width()*2.4)/100)));
  
  
        //MOBILE
       $(".logonavig").css("height", ((($(window).height()*3)/100)));
       $(".logonavig").css("width", ((($(window).width()*47)/100)));
       $(".FB_pic_container").css("height", ((($(window).height()*35)/100)));
       $(".FB_pic_container").css("width", ((($(window).width()*90)/100)));
       $(".galleria").css("height", ((($(window).height()*35)/100)));
       $(".galleria").css("width", ((($(window).width()*90)/100)));
  
       }
  
    else { 
            $("#menubar").css("font-size", ((($(window).height()*3)/100)));
            $(".fotoevento").css("height", ((($(window).height()*60)/100)));
            $(".fotoevento").css("width", ((($(window).height()*110)/100)));
            $(".pub").css("margin-left", ((($(window).height()*60)/100)));
                $(".testievento").css("font-size", ((($(window).width()*5)/100)));
  
                //MOBILE
       $(".logonavig").css("height", ((($(window).height()*3)/100)));
       $(".logonavig").css("width", ((($(window).width()*35)/100)));
          }
  
  
  
  })
  </code></pre>