ons-speed-dial-item

Material DesignのSpeed dialの子要素を表現する要素です。

実例

Speed dial

The Speed dial is a Material Design component similar to the Floating action button. It is used to display a <ons-fab> element that when clicked displays a menu.

The component is defined using the <ons-speed-dial> element and the items with <ons-speed-dial-item>.

<ons-speed-dial>
  <ons-fab>
    A
  </ons-fab>
  <ons-speed-dial-item>
    B
  </ons-speed-dial-item>
  <ons-speed-dial-item>
    C
  </ons-speed-dial-item>
  <ons-speed-dial-item>
    D
  </ons-speed-dial-item>
</ons-speed-dial>

Changing the position and direction

Just like with the <ons-fab> element the position can be changed using the position attribute. Normally the value is bottom right.

It is also possible to configure the direction in which the menu is displayed with the direction attribute. Possible values are up, down, left and right.

<ons-speed-dial
  position="bottom right"
  direction="up">
  ...
</ons-speed-dial>

関連情報

属性

名前 型 / デフォルト値 概要
modifier String このコンポーネントの表現を指定します。 Optional.
ripple If this attribute is defined, the button will have a ripple effect when tapped. (翻訳中) Optional.

お困りですか?

Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。

バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。

あわせて、下記の情報も参考にしてください。