layui框架 dropdown 模块

找了半天没找到一个合适的dropdown模块，本来就很简单的需求，就是希望在hover的时候能显示一个二维码小窗口出来，实在无奈，自己造了个模块用了。

预览图

支持

1. 四个方向
2. 简单快速

使用方式

资源下载： 蓝奏云 密码:6szx

下载模块，layui使用自定义模块不用多说吧，不知道看我博客发布的layui模块文章，然后自己把对应的样式css单独引入就行了。

html格式

<div class="layui-dropdown" id="dropdown">
  <button class="layui-dropdown-toggle">触发按钮</button>
  <div class="layui-dropdown-popper dropdown-top">
    ...显示的内容
  </div>  
</div>

html元素可以自己自定义，没必要限制在上面例子的元素，然后弹窗的大小是根据显示内容的大小而定的，本身没有限制，所有写的时候注意自己设置好css

控制方向

有四个class类：

1. dropdown-top
2. dropdown-bottom
3. dropdown-left
4. dropdown-right

如果你需要修改方向，在layui-dropdown-popper上加上对应的方向类就行了，必须要写，我没弄默认，只能存在一个方向类。

例：

<div class="layui-dropdown-popper dropdown-left">
    ...显示的内容
</div>

js

layui.use("dropdown",function(){
  const dropdown = layui.dropdown; //dropdown

  dropdown({
      el: "#dropdown"
    });
});

dropdown支持两个参数，一个是el，是容器的jq选择器，第二个是time，表示动画时间

 dropdown({
      el: "#dropdown"   //必须填写
      time: 300  //默认300,可以不设置
    });

到这里就结束了，有兴趣可以自己二开。