0

なぜこれが起こっているのか理解できませんdiv。通常は並んでいる2つのインライン要素（1つは送信ボタンが内部にあります）があります。次に、2番目を非表示div（display: none;）にしてから、jQuery関数を実装しslideToggleてボタンを表示/非表示にします。

2番目divが最初に表示されるとき、それらは並んでいて、すべてが正常に機能します。ただし、最初は表示されていないときに、をクリックしdivてボタンを表示すると、最初のボタンの下に表示されますdiv。

JSFiddle：（jsfiddle）

<div>
    <div style="display:inline-block; width:500px; background:red;" onclick="$('#button_div').slideToggle('fast');">
        <h2 style="display:inline-block;">Some text</h2>
    </div>


    <div style="display:inline-block; vertical-align:middle; display: none;" id="button_div" name="button_div">
       <input type="submit" id="create_button" name="create_button" value="Create" />
    </div>
</div>
4

2 に答える 2

1

非インラインcssを介して要素に宣言すると、jQueryは：ではなくとdisplay: inline-block;を切り替えます。inline-blocknoneblock

CSS

#button_div {
    display:inline-block;
}​

デモ

于 2013-01-03T22:34:45.057 に答える
0

float:leftの代わりにdisplay:inline-block、またはのvisibility:hidden代わりに使用する必要がありdisplay:none;ます。

于 2013-01-03T22:20:30.640 に答える