html - Mootools morph 问题 - div 覆盖图像

Question

想知道是否有人可以阐明这一点

http://jsfiddle.net/orbitalmedia/ZrxBb/7/

基本上，我正在尝试在图像上创建盲效果。 addClass 或 toggleClass 能够应用样式，但我正在尝试变形叠加层，以便它在图像上动画。

他

编辑..

这行得通，但我正在尝试使用 morph 和 css 类来完成同样的事情

$('span_2_0').tween('宽度', 150);

Answer 1

当你执行 .morph(".classname") 时，它只会采用它可以变形的属性并应用它们，即颜色、大小等，而不是 z-index 或位置。

无论如何，您都需要 .在类名之前，然后预先设置基本的 css 属性:

$('span_2_0').morph('.overlay');

不要使用颜色名称。使用可以变形的十六进制值。

#span_2_0 {
    display: block;
    position: absolute;
    z-index:1;  
    background-color: #fff;
}
.overlay {
    background-color: #0000ff;
    width:75px;
    height:150px;
}

http://jsfiddle.net/ZrxBb/12/