michelc/index.html

## index.html
<!doctype html>
<html>
<head>
  <meta charset=utf-8>
  <title>30 Days to Learn jQuery - Homework</title>
  <style>
    div.box { width: 400px;}
  </style>
</head>
<body>

<h1><a href="http://learnjquery.tutsplus.com/">30 Days to Learn jQuery</a> - Homework</h1>

<button>fadeSlideToggle()</button>

<div class="box">
  <p>
  Tonight, I want you to create your own fadeSlideToggle() method that will combine
  the functionality of slideToggle and fadeToggle. You may not reference either of
  these methods directly; instead, you’ll use animate().
  </p>
  <p>
  Hint: jQuery allows you to pass the string, “toggle,” as a value for height and
  opacity.
  </p>
  <p>
  When finished, the method should be called, like so: $('#box').fadeSlideToggle();.
  We’ll write a solution together in the next lesson, but try to do it by yourself
  this evening.
  </p>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script>

(function() {

  var box = $('div.box');

  jQuery.fn.fadeSlideToggle = function( speed, easing, callback ) {
    var $this = $(this);

    return $this.animate({
      'opacity': 'toggle',
      'height': 'toggle'
    }, speed, easing, callback);
  };

  $('button').on('click', function() {
    box.fadeSlideToggle(2000);
  });

})();

</script>

</body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset=utf-8>
	<title>30 Days to Learn jQuery - Homework</title>
	<style>
	div.box { width: 400px;}
	</style>
	</head>
	<body>

	<h1><a href="http://learnjquery.tutsplus.com/">30 Days to Learn jQuery</a> - Homework</h1>

	<button>fadeSlideToggle()</button>

	<div class="box">
	<p>
	Tonight, I want you to create your own fadeSlideToggle() method that will combine
	the functionality of slideToggle and fadeToggle. You may not reference either of
	these methods directly; instead, you’ll use animate().
	</p>
	<p>
	Hint: jQuery allows you to pass the string, “toggle,” as a value for height and
	opacity.
	</p>
	<p>
	When finished, the method should be called, like so: $('#box').fadeSlideToggle();.
	We’ll write a solution together in the next lesson, but try to do it by yourself
	this evening.
	</p>
	</div>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

	<script>

	(function() {

	var box = $('div.box');

	jQuery.fn.fadeSlideToggle = function( speed, easing, callback ) {
	var $this = $(this);

	return $this.animate({
	'opacity': 'toggle',
	'height': 'toggle'
	}, speed, easing, callback);
	};

	$('button').on('click', function() {
	box.fadeSlideToggle(2000);
	});

	})();

	</script>

	</body>
	</html>