jQuery dynamic div slider

Question

For some reason I am having a lot of trouble finding this...

Basically looking for a jquery slider plugin (with next and previous button), where the content can be any thing (div's,text, images, a combination,etc). The problem comes that I the content will be dynamically added, for example, if I have something like

<ul>
    <li> /* some divs, images, etc*/ </li>
    <li> /* some divs, images, etc*/ </li>
    <li> /* some divs, images, etc*/ </li>
</ul>

then I can dynamically add "

" tags to the "" via javascript and this wont break the slider.

I am currently using easy slider but it dosent really support the contents of the slider being 'dynamic'

thanks in advance.

Answer 1

Try This

this is custom way of creating a slider for next previous

jQuery.fn.extend({
  slideRightShow: function(speed) {
    return this.each(function() {
        $(this).show('slide', {direction: 'right'}, +speed || 1000);
    });
  },
  slideLeftHide: function(speed) {
    return this.each(function() {
      $(this).hide('slide', {direction: 'left'}, +speed || 1000);
    });
  },
  slideRightHide: function(speed) {
    return this.each(function() {
      $(this).hide('slide', {direction: 'right'}, +speed || 1000);
    });
  },
  slideLeftShow: function(speed) {
    return this.each(function() {
      $(this).show('slide', {direction: 'left'}, +speed || 1000);
    });
  }
});

Try This Fiddle