$(function() {
		// run the currently selected effect
		function runEffect() {
			// get effect type from 
			var selectedEffect = $( "#effectTypes" ).val();
			
			// most effect types need no options passed by default
			var options = {};
			// some effects have required parameters
			if ( selectedEffect === "scale" ) {
				options = { percent: 0 };
			} else if ( selectedEffect === "transfer" ) {
				options = { to: "#button", className: "ui-effects-transfer" };
			} else if ( selectedEffect === "size" ) {
				options = { to: { width: 200, height: 60 } };
			}

			// run the effect
			$( "#effect" ).effect( 'slide', options, 700, callback );
			$( "#effect1" ).effect( 'slide', options, 700, callback );
		};

		// callback function to bring a hidden box back
		function callback() {
			setTimeout(function() {
				//$( "#effect" ).removeAttr( "style" ).hide().fadeIn();
			}, 1000 );
		};

		// set effect from select menu value
		window.onload=(function() {
			runEffect();
			var settings = {
				showArrows: true
				};
				var pane = $('.scroll-pane')
				pane.jScrollPane(settings);
				var api = pane.data('jsp');
			return false;
		});
	});