0

現在、ネットを 1 日以上閲覧していますが、次の問題に対する有効な解決策が見つかりません。

  1. div は、下から上に向かってゼロから 100% まで成長する必要があります。
  2. テキストはフェードインする必要があります
  3. その後、タイムアウト
  4. その後、テキストはフェードアウトする必要があります
  5. 次に、div は div の下部に向かって縮小し、消えます。

.max{
  max-height:100%;height:100%;color:#fff;
  -moz-transition-property:max-height,height, color;
  -moz-transition-duration:3s,3s,1s;
  -moz-transition-delay:0s,0s,2s;
 }
.min{
  max-height:0%;height:0%;color:transparent;
  -moz-transition-property:max-height,height, color;
  -moz-transition-duration:3s,3s,1s;
  -moz-transition-delay:1s,1s,0s;
 }

max と min を 1 つの CssClass にシリアル化するにはどうすればよいですか? それが不可能な場合は、別の方法で行う方法を教えてください。しかし、それは飛びません。誰でもこれに関する良いアイデアや経験はありますか?

4

1 に答える 1

1

トランジションは、開始値と終了値が異なる場合にのみ機能します。

開始値と終了値は変わらないため ( 「あなたは無から来て、無に行く」(常に人生の明るい面を見る) )、1 つの CSS クラスでそれを行うことはできません。

おそらく可能なのは、2つのクラスを言っappearて、javascript(関数)disappearを使用して一定時間後にそれらを切り替えることですsetTimeout

于 2012-03-05T15:12:34.660 に答える