title: Loading css & javascript libraries in webview with Phonegap
body: <p>I'm developing a mobile app using Phonegap and it is primarily using the webView for content. One of the pages in the webView uses SwipeJS but when I load all of the dependent files(css &amp; js) the images do not display. I've been trouble shooting this issue for the last few hours and I think the best solution is to load all of the assets on the webview rather than in the app.</p>
  
  <p>The problem is when I add all of the assets to the page webview and then load the page thru the app none of the styles or script load. If I go to the page that i'm loading in the webView in a web browser that assets are all there and the SwipeJS gallery works. So i'm a little confused, why isn't the webview rendering the page with the working gallery??</p>
  
  <p>Here is the header source:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt; 
  &lt;html&gt; 
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;meta name="viewport" content="initial-scale=1, maximum-scale=1"&gt;
      &lt;title&gt;Title&lt;/title&gt;
  
      &lt;link rel="stylesheet" href="css/min.css" /&gt;
  
      &lt;script src="js/jquery-1.6.4.min.js"&gt;&lt;/script&gt;
      &lt;script src="js/jquery.dotdotdot-1.3.0.js"&gt;&lt;/script&gt;
      &lt;script src="cordova-2.0.0.js"&gt;&lt;/script&gt;
      &lt;script src="js/jquery.mobile-1.0.min.js"&gt;&lt;/script&gt;
      &lt;script src="js/min.js"&gt;&lt;/script&gt;
      &lt;script src="js/swipe.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
             $(document).bind("mobileinit", function(){
                 $.mobile.ajaxEnabled = false;
                 $.mobile.ajaxLinksEnabled = false;
                 $.mobile.pushStateEnabled = false;
                 $.mobile.hashListeningEnabled = false;
             });
  
             $(document).ready(function(){
  
                 // for select dropdown nav
                 $("#main-nav").change(function(){
                     if ($(this).val()!='') {
                         var mobPage ="http://m.example.com/"+$(this).val()+"?mode=Native";
                         $('#content').load(mobPage);
                     }
                 });
  
                 $('a').live("click", function(){
                     event.preventDefault();
                     var artPage = $(this).attr('href');
                     var mobPage = artPage+"?mode=Native";
                     $("#content").load(mobPage);
                 });
  
                 $('.ui-navbar a').live("click", function(){
                     event.preventDefault();
                     var artPage = $(this).attr('href');
                     var mobPage = "http://m.example.com/"+artPage+"?mode=Native";
                     $("#content").load(mobPage);
                 });
  
                 var mobPage = "http://m.example.com/?mode=Native";
  
                 $('#content').load(mobPage, function() {
                     $('#content').fadeIn(500);
                 });
           });
  
  
                          &lt;/script&gt;
  
          &lt;/head&gt;
  </code></pre>