自定义照片库无法正常工作

Question

我已经开始创建这个照片库，基于一些在线代码，我已经改变了一点。当您单击图像时，它会弹出并变大。单击新的大图像时，它将转到库中的下一个图像。单击“x”时，它应该关闭，但它不起作用。我已经让它工作，所以你可以点击图像外面，它会关闭。这是codepen：http://codepen.io/kaisle/pen/MwgWoV/

此外，我不确定最佳方式，当您单击图像时，弹出的图像会弹出 - 现在始终弹出第一个图像。我想过添加一个类“activeimg”，然后设置样式，只有那个图像显示（你可以看到我从代码开始），但我有点卡住了。

这是用于“.close”链接的jquery：

$('.close').click(function () {
$('#viewImage').add($('#faded')).fadeOut(function () {
    $('#viewImage').empty();
});

}）;

对于另一部分，可能更容易看到我的codepen，这是一个非常小的项目。

谢谢！