javascript图像平移'；阻塞'；导航链接和使div元素不透明

我有一个图像，bg，嵌入在一个div中，在页脚上方使用CSS。这个想法是当鼠标向左或向右移动时，图像会随之移动。上面的Javascript/body就是导致此功能正常工作的原因。它工作得很好，但是导航链接现在是不可点击的，内容分区是不透明的，你可以通过它们看到bg图像。当我删除#bg div时，一切正常。有没有办法解决这个问题？下面是HTML和CSS。我从这里的教程中得到了这个：

---

标记位于

中所有其他标记的顶部，我认为
的z索引在运行时发生了变化。当导航链路不可连接时，应检查z索引。可能您可以在javascript中更改z索引。我还有另一个建议，您最好删除*选择器css中的z索引，如下所示

* {
    text-decoration:none;
    font-family:Helvetica, sans-serif;
    z-index:100;
}

这里有一个解决方案：

只需删除
，然后

CSS:
脚本：
您可以更改
mousemove
事件目标

<script>
    $(document).ready(function () {
        $('body').mousemove(function (e) {
            var mousePos = (e.pageX / $(window).width()) * 100;
            $('body').css('backgroundPosition', mousePos + '% 0');
        });
    });
</script>


$（文档）.ready（函数（）{
$（'body'）.mousemove（函数（e）{
var mousePos=（e.pageX/$（window.width（））*100；
$（'body'）.css（'backgroundPosition'，mousePos+'%0'）；
});
});
这个答案效果最好，但还没有骰子；链接现在可以点击了，不再有不透明度问题，但是图像在滑动时，只在鼠标悬停在身体外时滑动。图像从左向右跳跃，而不是平滑滚动。有没有办法让它在body标签中正常工作？试试这个：
$（'body'）.mousemove（函数（e）{…
作为您的选择器。我已经更新了这个提琴来演示：我希望这是最好的解决方案，但它不起作用。bg图像根本没有出现。关于原因有什么想法吗？哦，我明白了，
上的
波士顿天际线4.jpg
在
上的
背景下。gif
在
上。我不知道图像的每个大小你的目标元素，你希望用鼠标移动。所以我的假设是这样的。如果你告诉我们一些关于你设计的细节，我们可以帮助你。
* {
    text-decoration:none;
    font-family:Helvetica, sans-serif;
    z-index:100;
}

body {
    height:100%;
    background:url(../img/boston_skyline4.jpg) no-repeat 0 0 scroll;
}

<script>
    $(document).ready(function () {
        $('body').mousemove(function (e) {
            var mousePos = (e.pageX / $(window).width()) * 100;
            $('body').css('backgroundPosition', mousePos + '% 0');
        });
    });
</script>