3

slideUp() アクションの後に消える div を作成するのに苦労しています。

html: 

<div class="rounded gradient" id="BCBox">
    <ul class="BCSelect">
        <li style="text-align:left;">Welcome <b>Username</b>,<br/><br/>Bla Bla Bla: </li>
        <li>
        <div class="button2 BCButton">
        </div>
        </li>
    </ul>
</div>
​

JavaScript: 

$('#BCBox').height($('#BCBox').height());
$('#BCBox').slideUp();​

ここでデモを見ることができます: http://jsfiddle.net/4feU9/7/

どういうわけか、ボックスは本来あるべき方法でアニメーション化したくありません...非常に速くスライドします。手伝ってくれますか？私は何を間違っていますか？

4

1 に答える 1

3

問題は、大きな余白の上で右に浮かせていることです（余白は要素の一部であるため、スライドアップ中にもアニメーション化されます）。ここでは、たとえば要素を絶対に配置するとアニメーションが修正されることがわかります: http://jsfiddle.net/4feU9/8/

html

<div class="rounded gradient" id="BCBox" >

        <ul class="BCSelect">
            <li style="text-align:left;">Welcome <b>Username</b>,<br/><br/>Bla Bla Bla:
            </li>
            <li >
                <div class="button2 BCButton"></div>    
            </li>
        </ul>

    </div>​

JavaScript

$('#BCBox').slideUp();

</p>

于 2012-04-26T12:31:57.717 に答える