0

我正在为primeng 的p-fullCalendar 实现工具提示功能。为了显示特定日历条目的工具提示,我添加了该条目的子 div 并设置了样式,使其看起来像工具提示。问题在于 child-div 元素(工具提示)不会覆盖其他日历条目。如果一列中有多个元素,则工具提示仅对列中的最后一个元素可见(仅当我将鼠标悬停在红色元素上时):

工具提示可见

黄色和粉色元素是不可见的。

工具提示不可见

我将工具提示类的 z-index 设置为 10000,将日历设置为 1,但它不起作用。

代码的相关部分:

  1. 日历 CSS:
.fc
  z-index: 1
.fc *
 z-index: 1
  1. 工具提示 HTML:
<div class="tt">Tooltip</div>
  1. 工具提示 CSS:
.tt  
  width: 100%
  color: white
  z-index: 10000 !important
  min-height: 100px 
  border: 3px solid red 
  background-color: black 
  text-align: center
  border-radius: 6px
  padding: 5px 5px
  position: relative
  opacity: 1
  top: 100%
  border-width: 5px

为了添加和删除元素,我使用了这个要点:https ://gist.github.com/reed-lawrence/1f6b7c328ad3886e60dc2b0adcf75a97

4

0 回答 0