made cssAttribute part of the options hash

Author: thinkswan

README.md

@@ -25,19 +25,19 @@ This will take the parents height, the elements own height and calculate the dis
 Options
 -------
 
-You can pass 1 parameter and an options hash to the plugin.
+You can pass an options hash to the plugin.
 
  - `onAttribute` - the css attribute that the value should be set on (default: 'margin-top')
  - `verticalOffset` - the number of pixels to offset the vertical alignment by, ie. 10, "50px", -100 (default: 0)
- - `parentSelector` - a selector representing the parent to vertically center this element within, ie. ".container" (default: the element's immediate parent)
+ - `parentSelector` - a selector representing the parent to vertically center this element within, ie. ".parent" (default: the element's immediate parent)
 
 Examples:
 
 	<script>
 	$(document).ready(function() {
-		$('#element-to-be-centered').flexVerticalCenter('padding-top');
-		$('#element-to-be-centered').flexVerticalCenter('margin-top', { verticalOffset: 50 });
-		$('#element-to-be-centered').flexVerticalCenter('padding-top', { verticalOffset: 50, parentSelector: '.parent' });
+		$('#element-to-be-centered').flexVerticalCenter();
+		$('#element-to-be-centered').flexVerticalCenter({ cssAttribute: 'padding-top', verticalOffset: '50px' });
+		$('#element-to-be-centered').flexVerticalCenter({ cssAttribute: 'padding-top', parentSelector: '.parent' });
 	});
 	</script>
 

index.html

@@ -62,9 +62,9 @@
 	<script src="jquery.flexverticalcenter.js"></script>
 
 	<script>
-		$('.first-item').flexVerticalCenter('padding-top');
-		$('.second-item').flexVerticalCenter('padding-top', { verticalOffset: '50px' });
-		$('.third-item').flexVerticalCenter('padding-top', { parentSelector: '.parent' });
+		$('.first-item').flexVerticalCenter({ cssAttribute: 'padding-top' });
+		$('.second-item').flexVerticalCenter({ cssAttribute: 'padding-top', verticalOffset: '50px' });
+		$('.third-item').flexVerticalCenter({ cssAttribute: 'padding-top', parentSelector: '.parent' });
 	</script>
 </body>
 

jquery.flexverticalcenter.js

@@ -10,11 +10,11 @@
 */
 (function( $ ){
 
-	$.fn.flexVerticalCenter = function( onAttribute, options ) {
-	  var attribute	= onAttribute || 'margin-top'; // the attribute to put the calculated value on
+	$.fn.flexVerticalCenter = function( options ) {
 	  var settings = $.extend({
-	    verticalOffset: 0,   // the number of pixels to offset the vertical alignment by
-      parentSelector: null // a selector representing the parent to vertically center this element within
+	    cssAttribute:   'margin-top', // the attribute to apply the calculated value to
+	    verticalOffset: 0,            // the number of pixels to offset the vertical alignment by
+      parentSelector: null          // a selector representing the parent to vertically center this element within
     }, options || {});
 
 		return this.each(function(){
@@ -25,7 +25,7 @@
 				var parentHeight = (settings.parentSelector) ? $this.parents(settings.parentSelector).first().height() : $this.parent().height();
 
 				$this.css(
-					attribute, ( ( ( parentHeight - $this.height() ) / 2 ) + parseInt(settings.verticalOffset) )
+					settings.cssAttribute, ( ( ( parentHeight - $this.height() ) / 2 ) + parseInt(settings.verticalOffset) )
 				);
 			};