Question

我尝试通过一些简单的数学更新上边距来设置一些IMG元素的动画效果。

它是这样的：

$('.spd2').css('margin-top', - offsetPC * 12 + '%');

它适用于这样的IMG：

<img src="img/pgDadosImportantes_i001.png" class="spd1" 
    style="right: 30%; top: 45%; z-index:10;" />

在css doc中设置此样式：

.ilustras {
    width: 960px;
    height: 100%;
    position: absolute;
    z-index: 0;
}

.ilustras img {
    position: absolute;
    float: right;
    width: auto; 
    height: auto;
    display: inline-block;
}

它非常适用于Firefox和IE。问题是在chrome中，margin-top的值没有更新。

我对所有涉及的元素进行了几处更改，将属性更改为位置，浮点数，宽度，高度，显示...以及在jQuery中命名marginLeft，margin-left的一些方法。

Chrome没有任何效果。如果我应用静态数字，它可以工作。

我在这里有一个示例：

http://unitfour.com.br/HotsiteCluster/

Apreciate任何帮助!!

*对不起我的英语和我的代码...我是一位巴西设计师，我们两个都在锻炼！

Answer 1

尝试类似：

$('.spd2').css('margin-top', ((parseInt($('.spd2').css('margin-top')) - offsetPC) * 12) + '%');

告诉我们是否可以。

Answer 2

它没有在Webkit（Chrome / Safari）中显示，因为 - 以一种奇怪的方式 - 它们没有获得scrollTop();值。我用window.pageYOffset来组成我的vars解决了这个问题。希望能帮到别人！谢谢大家的帮助！

jQuery - margin-top不在chrome中更新

2 个答案: