Swipe and Panel on the same Page just don't work

Swipe and Panel on the same Page just don't work

I have just overhauled my mobile page from 1.3 to 1.4.5 as there were problems in swipes. On the new platform I cannot get the swipe gestures to work with a panel on the same page, for my application the panel just doesn't appear when the ICON is clicked on the first page loaded. I have used the swipe demo as my foundation and this seems to work OK. I found that removing the line in red below from the supplied JS fixed the problem, however when I swipe forward say two pages and then swipe back one page the ICON no longer fires the panel.

  1. // Prefetch the next page
  2. // We added data-dom-cache="true" to the page so it won't be deleted
  3. // so there is no need to prefetch it
  4. if ( next ) {
  5. $( ":mobile-pagecontainer" ).pagecontainer( "load", next + ".html" );
  6. } 
In desperation I have cloned the Swipe demo page and this works fine. Then I added a simple panel (from the demo code) and an ICON in the header to fire it. Now the page is completely broken and will not even load the first image of New York, swiping through and the other images blink and go and the PANEL is just blank. It seems that there is a fundamental problem of using these two on the same page unless I have missed something seriously basic...

I have put a very basic setup here 


If you remove the panel the image appears,sadly I do not know how to put this up on jsfiddle with multiple pages but here is the link to the same demo on my site


The right hand side icon of a user should open the panel...... thanks for your help......