0

-webkit-transition独自の iPhone Safari プロパティを使用-webkit-transformして、優雅なアニメーションで要素を非表示にしようとしています。コード：

<div id="right" style="font-size: 500%; text-align: center; background-color: #fdf; -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 1s;">3</div>

<script type="text/javascript">
    function shrinky() {
        this.style.webkitTransform = 'scale(0,1)';
    }

    document.getElementById('right').onclick = shrinky;
</script>

優雅なアニメーションで要素が非表示に縮小されることを期待しています。

これは、デスクトップ Safari (OS X 10.5.6 の 3.2.1 (5525.27.1)) では問題なく動作しますが、iPhone (iPhone OS 2.2.1 (5H11)) では、div突然消えてしまいます。

Apple のドキュメント (登録が必要だと思います) のようにアニメーションを機能させる方法はありますか?

4

1 に答える 1

0

最初のscale引数を 0 ではなく非常に小さな 10 進数に設定すると、アニメーションが機能するようです。コード：

<div id="right" style="font-size: 500%; text-align: center; background-color: #fdf; -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 1s;">3</div>

<script type="text/javascript">
    function shrinky() {
        this.style.webkitTransform = 'scale(0.000001,1)';
    }

    document.getElementById('right').onclick = shrinky;
</script>

これがiPhoneのバグかどうかはわかりませんが、そのようです。

于 2009-05-06T22:26:18.087 に答える