title: Separate JPlayer's Playlist From The Player To Enable Scrolling For Mobile
body: <p>I am looking for a way to separate the playlist (#jp_container_1) in the default jQuery Jplayer music player from the actual player portion (#jquery_jplayer_1) at the top. My goal is to enable iScroll to work within the playlist. </p>
  
  <p>Here is a demo of the project I am working on where you can see the player and the two playlists on the audio tab. <strong><a href="http://sharethewub.com/mobile/" rel="nofollow">http://sharethewub.com/mobile/</a></strong>
  I would like to integrate the default jplayer playlist into the iScroll playlist that I have listed underneath jplayer.</p>
  
  <p>I attempted to set up a <a href="http://jsfiddle.net/GAuZ7/4/" rel="nofollow">jsfiddle</a> of this project but I had issues getting the tabs to work there.</p>
  
  <pre><code>&lt;div id="audio" style="position:absolute;top:9999px;overflow:hidden"&gt;
    &lt;div id="jquery_jplayer_1" class="jp-jplayer"&gt;&lt;/div&gt;
      &lt;div id="jp_container_1" class="jp-audio"&gt;  
      &lt;div class="jp-type-single"&gt;
        &lt;div id="jp_interface_1" class="jp-interface"&gt;
          &lt;ul class="jp-controls"&gt;
            &lt;li&gt;&lt;a href="#" class="jp-play" tabindex="1"&gt;play&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="jp-pause" tabindex="1"&gt;pause&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="jp-stop" tabindex="1"&gt;stop&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="jp-mute" tabindex="1"&gt;mute&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="jp-unmute" tabindex="1"&gt;unmute&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
          &lt;div class="jp-progress"&gt;
            &lt;div class="jp-seek-bar"&gt;
              &lt;div class="jp-play-bar"&gt;&lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="jp-volume-bar"&gt;
            &lt;div class="jp-volume-bar-value"&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="jp-current-time"&gt;&lt;/div&gt;
          &lt;div class="jp-duration"&gt;&lt;/div&gt;
        &lt;/div&gt;
         &lt;div id="jp_playlist_1" class="jp-playlist"&gt;
           &lt;ul&gt;
           &lt;/ul&gt;
        &lt;/div&gt; 
      &lt;/div&gt;
    &lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>Any insight into how to accomplish this would be greatly appreciated. Thanks!</p>