<div id="wrap">
<!-- section -->
<div class="section">
<div class="center">
<div class="current-masterpiece">click me</div>
<div class="current-masterpiece">click me</div>
<div class="current-masterpiece">click me</div>
<div class="current-masterpiece">click me</div>
<div class="current-masterpiece">click me</div>
<div class="current-masterpiece">click me</div>
</div>
</div>
<!--/section -->
</div>
.current-masterpiece {
width: 300px;
height: 200px;
margin-right: auto;
margin-left: auto;
box-shadow: inset 0 0 0 4px #ddd;
background: fade(#ddd, 20%);
line-height: 200px;
text-align: center;
}
View Compiled
$('.current-masterpiece').click(function () {
$elem = $(this);
$elem
.animate({
opacity: 0
}, 500, function () {
$elem.slideUp(500);
});
});
This Pen doesn't use any external CSS resources.