0

同じ要素で1つのcss属性から別の属性への遷移遅延を作成するにはどうすればよいですか?この例では、最初に幅、次にdiv要素の高さを遷移させます。

<div  class="rect"id="box2"></div>​

これがCSSです

.rect{
        margin-top:50px;
        width:10px;
        height:80px;
        background-color:black;

  }
    #box2{

         transition:all 1s ease-in-out ;
        -webkit-transition:all 1s ease-in-out ;
        -moz-transition:all 1s ease-in-out ;

    }

    #box2:hover{
          width:300px;
           height:200px;
    }​

このコードにより、高さと幅が連携し、#box2のtransition-delayにより、遷移全体の遅延が発生します。私は何をすべきか?

これがサンプルhttp://jsfiddle.net/bBnQW/です

4

2 に答える 2

0

私の知る限り、あなたはそうしません。CSS3のtransition-delayプロパティがありますが、これはすでに試したと思います。これに対する解決策が見つからない場合の私のアドバイスは、jQueryソリューションを使用してその効果を達成することです。ほんの数行のコードでそれを行うことができます(おそらくCSSにあるものよりも少ないかもしれません)。

于 2012-08-03T21:56:59.943 に答える
0
#box2{

             transition:width 1s ease-in-out, height 1s ease-in-out 1s ;
            -webkit-transition:width 1s ease-in-out, height 1s ease-in-out 1s ;
            -moz-transition:width 1s ease-in-out, height 1s ease-in-out 1s ;

        }

これがあなたが望むものなら...

于 2012-08-11T08:27:33.383 に答える