翻转图像更改更大的图像z-index

Question

我正在尝试设置翻转图像以翻转更大的主图像。

有效地，一个缩略图翻转会影响更大的翻转图像;我已经设法成功地将滚动分配到我的导航栏，除非它在我将其分配给此导航栏中的缩略图翻转时不起作用。

如此;这段代码有效;

 #navbar:hover ~ #smile {
    z-index: 10;
    }

但我希望在悬停结束时更改z-index .leftelement class，而不是navbar

 .leftelement:hover ~ #smile {
    z-index: 10;
    }

^^^为什么这不起作用？！^^^

这是一个小提琴;任何帮助都会受到如此多的赞赏，或是朝着正确的方向发展;

http://jsfiddle.net/YJ7yb/1/

谢谢你！