2回定義した オンスピードダイヤル 同じページに。
このような。
<!-- Define first speed dial -->
<ons-speed-dial id="first-dial" direction="down">
<ons-fab>
<ons-icon icon="ion-android-more-vertical"></ons-icon>
</ons-fab>
<ons-speed-dial-item>
<ons-icon icon="ion-android-create"></ons-icon>
</ons-speed-dial-item>
</ons-speed-dial>
<!-- Define second speed dial -->
<ons-speed-dial id="second-dial" direction="down">
<ons-fab>
<ons-icon icon="ion-ios-eye-outline"></ons-icon>
</ons-fab>
<ons-speed-dial-item>
<ons-icon icon="ion-android-done"></ons-icon>
</ons-speed-dial-item>
</ons-speed-dial>
私がクリックすると セカンドダイヤル、 スピードダイヤル項目 の下に表示されます ファーストダイヤル.
セカンドダイヤルの下にons-speed-dial-itemを表示することは可能ですか。
回答:
回答№1は2はい、そうです。両方に "position"属性を追加する必要があります <ons-speed-dial>
たとえば、タグ position="top left"
次に、それらの1つに「マリギン」を追加します。
したがって、コードは次のようになります。
<!-- Define first speed dial -->
<ons-speed-dial id="first-dial" direction="down" position="top left" >
<ons-fab>
<ons-icon icon="ion-android-more-vertical"></ons-icon>
</ons-fab>
<ons-speed-dial-item>
<ons-icon icon="ion-android-create"></ons-icon>
</ons-speed-dial-item>
</ons-speed-dial>
<!-- Define second speed dial -->
<ons-speed-dial id="second-dial" direction="down" position="top left" style="margin-left: 70px;">
<ons-fab>
<ons-icon icon="ion-ios-eye-outline"></ons-icon>
</ons-fab>
<ons-speed-dial-item>
<ons-icon icon="ion-android-done"></ons-icon>
</ons-speed-dial-item>
</ons-speed-dial>