title: Display Facebook like box in PhoneGap in the same WebView / page?
body: <p>How can I display a Facebook like box in PhoneGap in the same WebView / page as the remaining web application? I want to display a <a href="https://developers.facebook.com/docs/reference/plugins/like-box/" rel="nofollow">Facebook like box</a> in a PhoneGap application (using jQuery Mobile).</p>
  
  <p>PhoneGap opens a new browser window / webview for the Facebook like box. </p>
  
  <p>Same situation with other Facebook social plugins. I want the like box to be part of the normal content on that page, not open a childbrowser or so. Either of both variants (FBXML [1] &amp; iframe [2]) displays nicely in the same page on desktop browsers, but PhoneGap opens them in a new window, thereby leaving the application.</p>
  
  <p>Any suggestions?</p>
  
  <p>[1]:</p>
  
  <pre><code>&lt;div id="fb-root"&gt;&lt;/div&gt;&lt;script src="http://connect.facebook.net/en_US/all.js#xfbml=1"&gt;&lt;/script&gt;&lt;fb:like-box href="http://www.facebook.com/platform" width="292" show_faces="true" border_color="" stream="true" header="true"&gt;&lt;/fb:like-box&gt;
  </code></pre>
  
  <p>[2]:</p>
  
  <pre><code>&lt;iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;amp;width=292&amp;amp;colorscheme=light&amp;amp;show_faces=true&amp;amp;border_color&amp;amp;stream=true&amp;amp;header=true&amp;amp;height=427" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:427px;" allowTransparency="true"&gt;&lt;/iframe&gt;
  </code></pre>