Toggle class based on scroll position. Add your effects and style changes to your CSS.

jquery.scrollclass.js

(function($) {
	$.fn.scrollclass = function(options) {
		var opts = $.extend({}, $.fn.scrollclass.defaults, options),
			$this = this,
			state2 = false;

		$(document)
			.scroll(function() {
				if (state2 == false && $(this).scrollTop() > opts.pos) {
					state2 = true;
					$this.addClass(opts.class);
				} else if ($(this).scrollTop() < opts.pos) {
					state2 = false;
					$this.removeClass(opts.class);
				}
			})
			.trigger("scroll");
	};

	// default options
	$.fn.scrollclass.defaults = {
		class: "scrolled",
		pos: 50
	};
})(jQuery);