HTML5
：
イベントハンドラー内容属性
：
ondurationchange
編集：2022.04.25 by T.A.
duration
属性が、ちょうど更新された時に発火。
解説
テスト
HTML：
<STYLE> @keyframes Test{ 0% { left: 50px; } 100% { left: 150px; } } </STYLE> <DIV style="border:1px solid black; width:200px; height:70px; "> 10s： <DIV id=IdDiv1 ondurationchange="alert()" style="position: relative; width:25px; height:25px; background:red; left:50px; top:0px; animation-name:Test; animation-timing-function:linear; animation-duration:5s; "></DIV> </DIV>
リセット
表示
ここに表示
HTML：
<DIV style="position:relative; width:200px; height:50px; border:1px solid #0008; "> <SPAN id=IdSpan1 ondurationchange="alert()" style=" position:absolute; margin:auto; left:0; transition-duration:5s; transition-property:left; ">テスト</SPAN> </DIV> <BUTTON onclick="IdSpan1.style.left='200px'">セット</BUTTON>
リセット
表示
ここに表示
スクリプト：
IdDiv1.style.animationDuration="3s"; //¶効果なし
リセット
スクリプト実行
表示D
全てのD→DA
スクリプト：
IdSpan1.style.transitionDuration="1s"; //¶効果なし
リセット
スクリプト実行
表示D
全てのD→DA
表示内容：
表示
表示内容：
表示