Javascript CSS动画类型是阻止查看英雄图像

UX设计师在这里学习代码，请原谅我的无知和代码马虎

我有一个英雄形象，我有一个CSS动画类型，我已经把它。但是，该类型会阻止查看英雄图像。不知道为什么。我已经浏览了CSS，去掉了可能会产生干扰的任何颜色或背景信息。通过选择性地注释掉类，我想我已经确定了“link”类是问题所在，但是看看它的CSS，我不明白为什么

英雄的形象也有JS的东西应用到它，但我不认为这是根本原因或干扰任何真正的方式

该项目的JSFIDLE可在以下位置找到：

HTML的相关部分如下所示：

<!--Hero image with tilt effect-->

<div class="hero">
     <div class="grid__item">
    <a class="link link--kumya" href="About.html"><span data-letters="David French">David French</span></a>
            </div>

        <div class="hero__imgwrap">
            <img class="hero__img tilt-effect" data-tilt-options='{ "opacity" : 0.3, "extraImgs" : 3, "movement": { "perspective" : 1700, "translateX" : -7, "translateY" : -7, "rotateX" : -7, "rotateY" : -7 } }' src="images/welcome.jpg" alt="Welcome!" />
        </div>
</div>
<!--Hero image with tilt effect-->

检查你和srcook的位置，因此我颠倒了网格项目和英雄图像的顺序，现在它将背景覆盖在文本上。我还试着在img标签中改变src的位置，但这并没有真正起到任何作用。我想我已经确定这不是一个链接类问题，更多的是与我在页面上放置东西的顺序有关？好吧，所以我将网格项放在hero_imgwrap分区中。我想我以前尝试过，但由于某种原因，这次它起了作用。编辑：哦，等等，不。这不管用。它之所以有效，是因为我在后台禁用了tilteffect类……好的，所以将tilt effect类追溯到tiltfx.js文件并找到了这个函数：

function init（）{//使用类“tilt effect”[].slice.call（document.querySelectorAll（'img.tilt effect'））搜索img。forEach（function（img）{new tiltfx（img，JSON.parse（img.getAttribute（'data-tilt-options'））；}；}