CSS3：transition-delayプロパティ

transition-delay プロパティは、遅延 ― 遷移がいつ開始されるか ― を定義する。それは、［遷移の実行を、適用されたときから一定時間後に始める］ようにすることを許容する。transition-delay に対する値 0s は、対象のプロパティが変化すると同時に遷移を実行させることを意味する。他の場合、プロパティが変化した瞬間からの時間差を指定し，遷移の実行はその時間差だけ遅延されることになる。

transition-delay 値に負な時間差が指定された場合、プロパティが変化すると同時に遷移を実行させつつ、［指定された負な時間差だけ早くから実行し始めた］かのように現れるようにする。すなわち遷移は、その再生期間の途中から始まるように現れることになる。transition-delay 負にされている下で、遷移に暗黙の開始時の値がある場合、その値はプロパティが変化した瞬間の値からとられる。

名前	`transition-delay`
値	<time>#
初期値	0s
適用対象	すべての要素
継承	されない
百分率	受容しない
算出値	各アイテムが所要時間を与えるリスト
正準的順序	文法に従う
アニメーション型	アニメート不可

<DIV style=" border:1px solid #0008; width:200px; height:50px;
 position:relative;
">
 <SPAN id=IdReiSpan style="border:1px solid red;
  position:absolute;
  left:0;
  transition-delay:3s;
  transition-duration:1s;
  transition-property:left;
 ">テスト</SPAN>
</DIV>
<BUTTON onclick="IdReiSpan.style.left='200px'">セット</BUTTON>

<DIV style=" border:1px solid #0008; width:200px; height:50px;
 position:relative;
">
 <SPAN id=IdRei2Span style="border:1px solid red;
  position:absolute;
  left:0;
  transition-delay:3s,1s;
  transition-duration:1s;
  transition-property:left;
 ">テスト</SPAN>
</DIV>
<BUTTON onclick="IdRei2Span.style.left='200px'">セット</BUTTON>
<BUTTON onclick="IdRei2Span.style.left='0px'">セット</BUTTON>

¶<time>#の意味が不明

スクリプト：

スクリプト：