H5actionButton

功能描述

H5actionButton实现了底部弹出菜单的功能。菜单的弹出和消失带有相应的动画

依赖插件

无

快速使用

var actionButton = new ActionButton({
  tapHidden: true,
  items: [{
    img: './img/wx.png',
    text: '微信'
  }, {
    img: './img/wx_circle.png',
    text: '朋友圈'
  }, {
    img: './img/wx_circle.png',
    text: '朋友圈'
  }, {
    img: './img/wx_circle.png',
    text: '朋友圈'
  }, {
    img: './img/wx_circle.png',
    text: '朋友圈'
  }, {
    img: './img/wx_circle.png',
    text: '朋友圈'
  }]
}),
itemClick: function(item) {
  console.log(item.index)//被点击按钮的索引值
}

配置项

tapHidden

  • 类型：Boolean
  • 默认值：false
  • 作用：点击阴影是否自动隐藏弹出菜单
  • 是否必传：否

autoHide

  • 类型：Boolean
  • 默认值：true
  • 作用：点击菜单的选项是否自动隐藏弹出菜单
  • 是否必传：否

items

  • 类型：Array
  • 默认值：[]
  • 作用：弹出菜单的内容
  • 是否必传：否

itemClick

  • 类型：Function
  • 默认值：无
  • 作用：点击菜单的内容时会触发该函数
  • 是否必传：否

方法

显示弹出菜单

actionButton.show()

隐藏弹出菜单

actionButton.hide()

特别说明

无

是否仍需要帮助？ 请保持联络！
最后更新于 2024/04/24