了解下Foundation 下拉菜单

实例

Dropdown Button

  Paris Title
  
Some text.. some text..
  
  
Paris, je t'aime.

下拉菜单方向

默认情况下下拉菜单在底部，可以通过添加 data-options="align:left|right|top" 来修改其方向：

实例

Right
Top
Bottom
Left

下拉菜单触发条件

默认情况下，下拉菜单在点击按钮后显示。如果你需要在鼠标移动上去后显示，可以在按钮上使用 data-options="is_hover:true" 属性:

实例

Hover over me

  
Link 1
  
Link 2
  
Link 3

分割按钮

我们可以在按钮上添加 .split 类来设置一个分割效果的按钮，分割后会在 元素上生成一个方向向下的图标按钮:

实例

Split Button
  



  
Link 1
  
Link 2
  
Link 3




$(document).ready(function() {
    $(document).foundation();
})