"Return to top" button as a plugin with some slick defaults.

readme.md

#Usage

$.mcToppy({
  text: 'Get back up there!',
  speed: 1000,
  css: { fontFamily: 'Arial' }
});

You can over-ride any of the defaults, however if not specified the defaults will be used.

If you want the position to be at the top, you need to set the 'top' and then clear the 'bottom' css rules.

Demo here

mctoppy.jquery.js

$.mcToppy = function (options) {
  var btn = $('<button></button>'),
    defaults = {
      css: {
        position: 'fixed',
        bottom: '16px',
        right: '16px',
        backgroundColor: '#FFF',
        color: '#444',
        padding: '4px 6px',
        borderRadius: '4px',
        display: 'none'
      },
      text: 'Top',
      speed: 500,
      callback: undefined
    };
  options = options || {};
  options = $.extend({}, defaults, options);
  btn.css(options.css).text(options.text).on('click', handle_click).appendTo('body');
  $(window).on('scroll', handle_scroll);

  function handle_scroll() {
    if ($(this).scrollTop() != 0) {
      btn.fadeIn('fast');
      return;
    }
    btn.fadeOut('fast');
  }

  function handle_click() {
    $('html,body').animate({
      scrollTop: 0
    }, options.speed).promise().done(options.callback);
  }

};