$(document).ready(function()
{
   $('ul.imageGallery').each(function()
   {
      $ul = $(this);

      $ul.wrap('<div class="imageGallery-images" style="position: relative; overflow: hidden; height: 500px" />');
      var $parent  = $ul.parent('.imageGallery-images');

      $ul.children('li').css({'height': $(this).find('img').css('height')});
      $ul.css({"list-style-type": 'none', 'position': 'absolute', 'left': 0, 'top': 0});

      $parent.before('<div class="imageGallery-prev" style="text-indent: -9999px; height: 15px; width: ' + $parent.find('ul').css('width') + '">Previous</div>');
      $parent.after('<div class="imageGallery-next" style="text-indent: -9999px; height: 15px; width: ' + $parent.find('ul').css('width') + '">Next</div>');

      $parent.next('.imageGallery-next').hover(function()
      {
         height = ($parent.find('ul').height() - $parent.height()) * -1;
         $parent.find('ul').animate({ 'top': height }, 2000)
      }, function()
      {
         $parent.find('ul').stop();
      });

      $parent.prev('.imageGallery-prev').hover(function()
      {
         $parent.find('ul').animate({ 'top': 0 }, 2000)
      }, function()
      {
         $parent.find('ul').stop();
      });

      $parent.find('ul > li:last').after($parent.find('ul > li:first')[0]);
   });
});

