在<a> exempt from becoming link</a>内制作图片或div

Question

我正在寻找一种方法来制作整个<div>链接，但不是其中的内容。比方说我在<div>中有四个图像，如果你点击图像以外的任何地方，它实际上就是一个链接。我需要它以这种方式运行，因为我将它用于灯箱。只要您点击图片以外的任何地方，它就会有<a href="#close">属性。我需要能够从屏幕上的任何位置滚动图像，因此它的容器必须保持100％的高度和宽度。我还发现Javascript解决方案可以使整个<div>可点击，但我无法找到如何制作它以便它仍然可以滚动并从{{​​1}}中排除图像。

Here's my Code Pen

Answer 1

你必须使用JavaScript：

document.getElementById('link').addEventListener('click', function (e) {
    if ( e.targetElement != this ) e.preventDefault();
});