Question

由于常规jQuery动画在iOS上不流畅（.hide()，slideDown()），我试图将我的速记.fade()和.slideDown()函数转换为速记{ {1}}函数，因此我可以使用jQuery.Animate插件将这些动画转换为CSS3，同时维护jQuery后备。

我认为使用这种方法淡化div应该很容易，但试图让div从中心向下滑动让我很头疼。

div的普通CSS是......

.animate()

然后我使用以下内容延迟，然后将div滑下来......

.zip{
    width:130px;
    height:70px;
    left:50%;
    top:50%;
    margin-top:-46px;
    margin-left:-76px;
    position: absolute;
    text-align: center;
    z-index: 2;
    background:rgba(0,155,23,.8) url(overlay.png);
    border-radius: 10px;
    padding:10px;
    border:1px solid #fff;
    box-shadow:0 0 40px #000;
}

这显然很好，但是它不会被插件拾取。

那么，如何使用$(".zip").delay(1000).slideDown(200);将其转换为函数？

我的尝试：

... CSS

.animate()

...的jQuery

.zip{
    display:none;
    height:0;
    padding:0;
    /* Plus everything else */
}

除了从左下角滑落，而不是从中间滑落。

同样，也许我这样做完全错了，并且有更好的方法在iOS设备上使用CSS3加速转换，同时仍然提供jQuery后备，在这种情况下，请分享！

Answer 1

为宽度和边距左侧设置动画。或者，您可以仅为宽度设置动画并将边距设置为自动（这意味着水平居中）

Answer 2

你可以使用slideDown（）`方法：

$('.zip').slideDown()

DEMO

使用jQuery动画让div从中心向下滑动？

2 个答案: