Add new options to select the child element

I've modified the code to work even if the child element is not a 'li' element,
the new option 'child' can be used for searching element such as:
class based element '.someclass'
div element or any other html element like p, a etc
the modified code:
/*
Totem Ticker Plugin
Copyright (c) 2011 Zach Dunn / www.buildinternet.com
Released under MIT License
--------------------------
Structure based on Doug Neiner's jQuery plugin blueprint: http://starter.pixelgraphics.us/
 */
(function($) {

  if (!$.omr) {
    $.omr = new Object();
  }
  ;

  $.omr.totemticker = function(el, options) {

    var base = this;

    // Define the DOM elements
    base.el = el;
    base.$el = $(el);

    // Add a reverse reference to the DOM object
    base.$el.data("omr.totemticker", base);

    base.init = function() {
      base.options = $.extend({}, $.omr.totemticker.defaultOptions, options);

      // Define the ticker object
      base.ticker;

      // Adjust the height of ticker if specified
      base.format_ticker();

      // Setup navigation links (if specified)
      base.setup_nav();

      // Start the ticker
      base.start_interval();

      // Debugging info in console
      // base.debug_info();
    };

    base.start_interval = function() {

      // Clear out any existing interval
      clearInterval(base.ticker);

      if (base.options.direction == 'up') {
        // If the direction has been set to up
        base.ticker = setInterval(function() {
          base.$el.find(options.child + ':last').detach().prependTo(base.$el).css(
              'marginTop', '-' + base.options.row_height);
          base.$el.find(options.child + ':first').animate({
            marginTop : '0px'
          }, base.options.speed, function() {
            // Callback functions go here
          });
        }, base.options.interval);
      } else {
        // Otherwise, run the default of down
        base.ticker = setInterval(function() {

          base.$el.find(options.child + ':first').animate({
            marginTop : '-' + base.options.row_height
          }, base.options.speed, function() {
            $(this).detach().css('marginTop', '0').appendTo(base.$el);
          });

        }, base.options.interval);
      }
    }

    base.reset_interval = function() {
      clearInterval(base.ticker);
      base.start_interval();
    }

    base.stop_interval = function() {
      clearInterval(base.ticker);
    }

    base.format_ticker = function() {

      if (typeof (base.options.max_items) != "undefined"
          && base.options.max_items != null) {

        // Remove units of measurement (Should expand to cover EM and % later)
        var stripped_height = base.options.row_height.replace(/px/i, '');
        var ticker_height = stripped_height * base.options.max_items;

        base.$el.css({
          height : ticker_height + 'px',
          overflow : 'hidden'
        });

      } else {
        // No heights were specified, so just doublecheck overflow = hidden
        base.$el.css({
          overflow : 'hidden'
        })
      }

    }

    base.setup_nav = function() {

      // Stop Button
      if (typeof (base.options.stop) != "undefined"
          && base.options.stop != null) {
        $(base.options.stop).click(function() {
          base.stop_interval();
          return false;
        });
      }

      // Start Button
      if (typeof (base.options.start) != "undefined"
          && base.options.start != null) {
        $(base.options.start).click(function() {
          base.start_interval();
          return false;
        });
      }

      // Previous Button
      if (typeof (base.options.previous) != "undefined"
          && base.options.previous != null) {
        $(base.options.previous).click(
            function() {
              base.$el.find(options.child + ':last').detach().prependTo(base.$el).css(
                  'marginTop', '-' + base.options.row_height);
              base.$el.find(options.child +  ':first').animate({
                marginTop : '0px'
              }, base.options.speed, function() {
                base.reset_interval();
              });
              return false;
            });
      }

      // Next Button
      if (typeof (base.options.next) != "undefined"
          && base.options.next != null) {
        $(base.options.next).click(function() {
          base.$el.find(options.child + ':first').animate({
            marginTop : '-' + base.options.row_height
          }, base.options.speed, function() {
            $(this).detach().css('marginTop', '0px').appendTo(base.$el);
            base.reset_interval();
          });
          return false;
        });
      }

      // Stop on mouse hover
      if (typeof (base.options.mousestop) != "undefined"
          && base.options.mousestop === true) {
        base.$el.mouseenter(function() {
          base.stop_interval();
        }).mouseleave(function() {
          base.start_interval();
        });
      }

      /*
       * TO DO List ---------------- Add a continuous scrolling mode
       */

    }

    base.debug_info = function() {
      // Dump options into console
      console.log(base.options);
    }

    // Make it go!
    base.init();
  };

  $.omr.totemticker.defaultOptions = {
    message : 'Ticker Loaded', /* Disregard */
    next : null, /* ID of next button or link */
    previous : null, /* ID of previous button or link */
    stop : null, /* ID of stop button or link */
    start : null, /* ID of start button or link */
    row_height : '100px', /* Height of each ticker row in PX. Should be uniform. */
    speed : 800, /* Speed of transition animation in milliseconds */
    interval : 4000, /* Time between change in milliseconds */
    max_items : null, /*
                       * Integer for how many items to display at once. Resizes
                       * height accordingly (OPTIONAL)
                       */
    mousestop : false, /* If set to true, the ticker will stop on mouseover */
    direction : 'down', /* Direction that list will scroll */
    child: 'li' /* Child element, can be class too */
  };

  $.fn.totemticker = function(options) {
    return this.each(function() {
      (new $.omr.totemticker(this, options));
    });
  };

})(jQuery);
VicTheme team
buildinternet / totem

Add new options to select the child element #5
