通过CSS类值指定jQuery工具提示位置

Question

我有一个菜单，可以通过包含的div类更改位置。 我正在使用jquery 工具提示小部件

.menu-top{...}
.menu-top .button{...}

.menu-left{...}
.menu-left .button{..}

.menu-right{...}
.menu-right .button{..}

HTML是这样的

<div class="menu-top">
  <div class="button" data-toggle="tooltip" data-placement="top" title="menu item 1">
  <div class="button" data-toggle="tooltip" data-placement="top" title="menu item 2">
  <div class="button" data-toggle="tooltip" data-placement="top" title="menu item 3">
  .....
  ... 
</div>

当我将div class更改为menu-left时 ，它显示在页面的左侧。 但是工具提示出现在菜单项的顶部。 如何通过菜单类名称使用jquery更改数据放置？ 我是jquery新手。

Answer 1

您可以通过更改data-placement值Eg来更改工具提示data-placement ：

<div class="menu-top">
  <div class="button" data-toggle="tooltip" data-placement="top" title="menu item 1">   //TOP Position
  <div class="button" data-toggle="tooltip" data-placement="bottom" title="menu item 1"> //Bottom Position
  <div class="button" data-toggle="tooltip" data-placement="left" title="menu item 1"> //LEFT Position
  <div class="button" data-toggle="tooltip" data-placement="right" title="menu item 1">//RIGHT Position
</div>

数据放置的Value取决于您使用的PLUGIN 。