I have modified (very slightly) the Mootools class noobSlide ( to create a flickr style photostream.

Here is the modified html (note you can see the original on the above page)

print("code sample");<h2>Sample 2</h2>
<div class="sample">
<div class="mask4">
 <div id="box2">
  <span><img src="img1.jpg" alt="Photo" /></span>
  <span><img src="img2.jpg" alt="Photo" /></span>
  <span><img src="img3.jpg" alt="Photo" /></span>
  <span><img src="img4.jpg" alt="Photo" /></span>
  <span><img src="img5.jpg" alt="Photo" /></span>
  <span><img src="img6.jpg" alt="Photo" /></span>
  <span><img src="img7.jpg" alt="Photo" /></span>
<p class="buttons">
 <span id="prev1">&lt;&lt; Previous</span>
 <span id="next1">Next &gt;&gt;</span>

Here is the JS

print("code sample");//SAMPLE 2 
 var hs2 = new noobSlide({
  box: $('box2'),
  items: [1,2,3,4],
  size: 500,
  interval: 3000,
  buttons: {
   previous: $('prev1'),
   next: $('next1')

What I would like to know is how to add an ajax call to this, I have about 50 images and I only want to load about 5 (actually I suppose I only need to load 2) at a time.

So I would like some help on how to add ajax to noobslide using the native mootools ajax class/function



Can someone point me in the direction of why it might not be working or give me an idea on what else I can post to get more help :)

Paul M
+1  A: