title: Jquery Mobile 1.4 external panel do not open after navigating to other page
body: <p>We are developing an mobile application using jquery mobile and apache cordova. After migrating to jquery mobile 1.4.0 we switched to external panel but there is a problem with the panel. </p>
  
  <p>There is a simple example of the problem in <a href="http://jsfiddle.net/Q58MZ/3/" rel="nofollow">http://jsfiddle.net/Q58MZ/3/</a></p>
  
  <p>To reproduce the problem you must:
  1 click on page1 from the menu link
  2 click on page2 from the menu link
  3 click on page1 from the menu link
  4 click on page2 from the menu link
  5 click on "GO TO PAGE 1" link in the content</p>
  
  <p>Then the menu wont open it will add classes that its open but it wont open.</p>
  
  <p>Here is the sample code to reproduce it:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;meta name="format-detection" content="telephone=no" /&gt;
      &lt;meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
      &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /&gt;
      &lt;script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"&gt;&lt;/script&gt;  
      &lt;script&gt;
          $(document).ready(function() {
              $.mobile.defaultPageTransition = 'none';
              $("#mypanel").panel();
          });
          $(document).bind('panelbeforeopen', function(e, data) {
              console.log("before open");
          });
          $(document).bind('panelbeforeclose', function(e, data) {
              console.log("before close");
          });
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div data-role="panel" id="mypanel"&gt;
          &lt;a href="#page1"&gt;page1&lt;/a&gt;
          &lt;br /&gt;
          &lt;a href="#page2"&gt;page2&lt;/a&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="page0"&gt;
          &lt;div data-tap-toggle="false" data-role="header" &gt;
              &lt;a href="#mypanel"&gt;menu&lt;/a&gt;
              &lt;h1&gt;PAGE 0&lt;/h1&gt;
          &lt;/div&gt;
          &lt;div data-role="content"&gt; 
              PAGE 0
          &lt;/div&gt;
          &lt;div data-tap-toggle="false" data-role="footer" &gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="page1"&gt;
          &lt;div data-tap-toggle="false" data-role="header" &gt;
              &lt;a href="#mypanel"&gt;menu&lt;/a&gt;
              &lt;h1&gt;PAGE 1&lt;/h1&gt;
          &lt;/div&gt;
          &lt;div data-role="content"&gt; 
              PAGE 1
          &lt;/div&gt;
          &lt;div data-tap-toggle="false" data-role="footer" &gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="page2"&gt;
          &lt;div data-tap-toggle="false" data-role="header" &gt;
              &lt;a href="#mypanel"&gt;menu&lt;/a&gt;
              &lt;h1&gt;PAGE 2&lt;/h1&gt;
          &lt;/div&gt;
          &lt;div data-role="content"&gt; 
              PAGE 2
              &lt;a href="#page1"&gt;GO TO PAGE 1&lt;/a&gt;
          &lt;/div&gt;
          &lt;div data-tap-toggle="false" data-role="footer" &gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>The strange thing is that when I navigate through the panel links the panel works but when I click to link that is not in the panel it wont open anymore. We tried also with $.mobile.changePage and the new one with the :pagecontainer but it is the same. If someone have similar problem please let me know how he fix it. 
  Thanks in advance. </p>