0

私はスタイルシートを使用することで成功しましたが、JavaScriptでそれを行うことは私にとってはうまくいきません。私はこれをプログラムで行う必要があります。うまくいけば、私がdivを「成長」させようとしていることに気付くでしょう。

var myElement = document.createElement('div');
myElement.style.height = '0px';
myElement.style.padding = '0px';
myElement.style.webkitTransition = '2s'; /* problem with this line ? */
myElement.style.height = '200px';
4

1 に答える 1

1

私はcss3に精通していませんが、私がこの作業を試したことによると：

var myElement = document.createElement('div');
myElement.style.height = '0px';
myElement.style.padding = '0px';
myElement.style.height = '0';
myElement.style.webkitTransition = '2s';
// Append the element to DOM
document.getElementById("a").appendChild(myElement);
// Alter the height after forcing a reflow
myElement.offsetWidth=myElement.offsetWidth;
myElement.style.height = '200px';​
/*// Alter the height later
setTimeout(function() {
    myElement.style.height = '200px';
}, 1);​*/

Esailijaのおかげで、この質問の回答で述べられているように、リフローを強制する必要があります。などのプロパティにアクセスoffsetWidthすると、リフローが強制されるため、タイマーよりも優れた方法です。

于 2012-07-26T15:40:46.990 に答える