Question

我需要一个动画gif来显示，所以我将它设置为css背景，但它并不是一直显示。

在（.poroid）的捏合中发生了什么，我缩放（.poaroid）的高度。现在，当比例小于或等于0.42时，我正试图触发这个动画gif poof动画。换句话说，当夹点导致.polaroid比其原始尺寸小42％或更低时。

因此，如果您在多点触控设备上转到此网址：https://googledrive.com/host/0BwJVaMrY8QdcTW9BMHg4b0lPUDA/index.html

然后捏一下宝丽来卡片（.polaroid），它们变得更小，让它们足够小并且它们被替换，但动画不会一直发生。为什么不呢？

这是我的js：

function transform(e){
    var cssScale = "scaleY("+ scaleFactor +")";
    element.css({
        webkitTransform: cssScale,
        webkitTransformOrigin: cssOrigin,
        transform: cssScale,
        transformOrigin: cssOrigin,
    });
    if(scaleFactor <= 0.42){
        $(element).replaceWith('<div class="poof"></div>');
        $('.poof').css('height', itsHeight).css('width', itsWidth).css('background', 'transparent url(poof.gif?v='+time+') center no-repeat');
        time++;
        setTimeout(function(){
            $('.poof').remove();
        }, 1500);
    }
}

<div class="poof"></div>取代.polaroid，如果收缩到42％或更低;然而，它的背景（动画gif动画）并不是每次都显示，即使jQuery每次都将它写为css背景。

动画GIF CSS背景不会一直显示

0 个答案: