jQuery Fade effects

by Brock Callahan

HTML

<img src="http://placehold.it/200x200" alt="">
<button>Show image</button>

CSS

body { background-color: salmon; }
img { display: none; }
button { position: absolute; top: 250px;}

JavaScript

$(document).ready(function () {
		var tog = 0;
    $("button").click(function () {
    		if (!tog) {
            $("img").fadeIn("slow");
            $("button").text("Hide image");
            tog++;
        } else {
            $("img").fadeOut("slow");
            $("button").text("Show image");
            tog=0;
        }
    });
});