使用图像作为菜单：div中的动画

Question

我希望将图片设置为菜单动画。 当悬停图像的某些部分时，会出现一个菜单列表。 我是一个新手编码器，所以我在使用过程中有点迷失（图像映射，精灵，js ......）。

这是我正在努力实现的工作：

的jsfiddle

Menu Equipiece  
但是，菜单不会出现在车轮上方。

我做了一个先前测试的地方：

的jsfiddle

Test

CSS

.roue{
position:absolute;
z-index:2;
margin-top:-200px;
margin-left:265px;
transition:all 0.5s ease;}

Answer 1

您应该将div#menu放在div#roue内，然后才能正常工作。我对小提琴进行了更新，你可以看到here。

<div class="roue">
    <div>
        <img src="http://www.equipiece.com/userfiles/www.equipiece.com/images/Remorque-roue.png?ts=1450481525803" alt="roue de remorque" width="90" height="90">
    </div>

    <div id="menu">
        <ul id="list">
            <li><a href="http://www.equipiece.com/cat-roues-85_0-87_0_0_0.htm">Roue complète</a></li>
            <li><a href="#">Jantes</a></li>
            <li><a href="#">Pneus</a></li>
            ...
        </ul>
    </div>
</div>