Problem in creating muntiple JQuery Scrollables

[arsenal01]

Hi,
Hope every one will be fine, i am facing problem with JQuery Scrollable menu, i am trying to placing 2 scrollable panels on a single asp.net page.

When there is one panel every thing works fine but when i copy and paste the code so my web page contains two panels vertically, the thing doesn't work, the tow panels just hanged!!

Here is the code

<!-- "previous page" action -->
<a class="prev browse left"></a>

<!-- root element for scrollable -->
<div class="scrollable">   

   <!-- root element for the items -->
   <div class="items">

      <!-- 1-5 -->
      <div>
         <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg" />
         <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg" />
         <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg" />
         <img src="http://farm1.static.flickr.com/28/66523124_b468cf4978_t.jpg" />
         <img src="http://farm1.static.flickr.com/164/399223606_b875ddf797_t.jpg" />
      </div>

      <!-- 5-10 -->
      <div>
         <img src="http://farm1.static.flickr.com/163/399223609_db47d35b7c_t.jpg" />
         <img src="http://farm1.static.flickr.com/135/321464104_c010dbf34c_t.jpg" />
         <img src="http://farm1.static.flickr.com/40/117346184_9760f3aabc_t.jpg" />
         <img src="http://farm1.static.flickr.com/153/399232237_6928a527c1_t.jpg" />
         <img src="http://farm1.static.flickr.com/50/117346182_1fded507fa_t.jpg" />
      </div>

      <!-- 10-15 -->
      <div>
         <img src="http://farm4.static.flickr.com/3629/3323896446_3b87a8bf75_t.jpg" />
         <img src="http://farm4.static.flickr.com/3023/3323897466_e61624f6de_t.jpg" />
         <img src="http://farm4.static.flickr.com/3650/3323058611_d35c894fab_t.jpg" />
         <img src="http://farm4.static.flickr.com/3635/3323893254_3183671257_t.jpg" />
         <img src="http://farm4.static.flickr.com/3624/3323893148_8318838fbd_t.jpg" />
      </div>

   </div>

</div>

<!-- "next page" action -->
<a class="next browse right"></a>
<!-- "previous page" action -->
<a class="prev browse left"></a>

<!-- root element for scrollable -->
<div class="scrollable">   

   <!-- root element for the items -->
   <div class="items">

      <!-- 1-5 -->
      <div>
         <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg" />
         <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg" />
         <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg" />
         <img src="http://farm1.static.flickr.com/28/66523124_b468cf4978_t.jpg" />
         <img src="http://farm1.static.flickr.com/164/399223606_b875ddf797_t.jpg" />
      </div>

      <!-- 5-10 -->
      <div>
         <img src="http://farm1.static.flickr.com/163/399223609_db47d35b7c_t.jpg" />
         <img src="http://farm1.static.flickr.com/135/321464104_c010dbf34c_t.jpg" />
         <img src="http://farm1.static.flickr.com/40/117346184_9760f3aabc_t.jpg" />
         <img src="http://farm1.static.flickr.com/153/399232237_6928a527c1_t.jpg" />
         <img src="http://farm1.static.flickr.com/50/117346182_1fded507fa_t.jpg" />
      </div>

      <!-- 10-15 -->
      <div>
         <img src="http://farm4.static.flickr.com/3629/3323896446_3b87a8bf75_t.jpg" />
         <img src="http://farm4.static.flickr.com/3023/3323897466_e61624f6de_t.jpg" />
         <img src="http://farm4.static.flickr.com/3650/3323058611_d35c894fab_t.jpg" />
         <img src="http://farm4.static.flickr.com/3635/3323893254_3183671257_t.jpg" />
         <img src="http://farm4.static.flickr.com/3624/3323893148_8318838fbd_t.jpg" />
      </div>

   </div>

</div>

<!-- "next page" action -->
<a class="next browse right"></a>

Please tell me whats going wrong?

Thanks,

[Virtuous]

Could you provide the jquery code that goes along with it or at least the plugin (if any) name and version.

[newtonpage]

I recognize the code as being jQuery Tools - I have fought with this suite before.

See http://flowplayer.org/tools/scrollable

Basically, Flowplayer has published an suite of enhancements to jQuery UI and an (almost) robust set of api's. The idea is great but it is extremely fussy and can break really easily without an effective method to debug it.

Net-net: in order to make scrollable work correctly, you have get the HTML, the CSS and the configuration exactly correct - whether you have one or more scrollables on a page.

Make certain that you check your code against the "minimum configuration" and then check the example of multiple scrollables.

In order to help, you must supply the all relevant HTML, CSS and configuration code.

S