Javascript 如何在mouseover div上添加向下箭头

我正在使用fullcalendar。如果我将鼠标悬停在任何日期字段上，一个div弹出窗口将像工具提示一样打开它

这里我想加一个向下箭头，像这样

如何在div中添加此向下箭头。我有一个示例

$（文档）.ready（函数（）{
变量日期=新日期（）；
var d=date.getDate（）；
var m=date.getMonth（）；
var y=date.getFullYear（）；
变量事件\u数组=[
{
标题：“Test1”，
开始日期：新日期（2012年8月20日），
提示：'个人提示1'}，
{
标题：“Test2”，
开始日期：新日期（2012年8月21日），
提示：'个人提示2'}
];
$（“#日历”）.fullCalendar({
标题：{
左：“上一个，下一个今天”，
中心：'标题'，
右图：“月，agendaWeek，agendaDay”
},
是的，
事件：事件数组，
eventRender:函数（事件，元素）{
element.attr（'title'，event.tip）；
}
});
});
$（document）.on（'hover'，'fc day number'，function（））{
$（'#calinfo'）.addClass（'hide'）；
var data=$（this.html（）；
var offset=$（this.offset（）；
$（'#calinfo'）.css（'left'，offset.left）；
$（'#calinfo'）.css（'top'，（offset.top-40））；
$（'#cal info'）.html（'关于：'+$（this.html（）+'
链接到谷歌：'）的信息；
//p、 html（“左：“+offset.left+”，顶部：“+offset.top”）；
$（'#calinfo'）。removeClass（'hide'）；
});
.tag{
背景色：#000；
颜色：#fff；
填充：3倍；
最大高度：60px；
溢出：自动；
位置：固定；
z指数：999；
}

更新CSS:

.tag{
  background-color:#000;
  color:#fff;
  padding:3px;
  max-height:60px;
  overflow:auto;
  position: fixed;
  z-index:999;
  background-image: url("http://i.stack.imgur.com/P1bAW.png");
}

这会将图像设置为您的div背景。您可以设置本地路径而不是此url。
更新CSS:

.tag{
  background-color:#000;
  color:#fff;
  padding:3px;
  max-height:60px;
  overflow:auto;
  position: fixed;
  z-index:999;
  background-image: url("http://i.stack.imgur.com/P1bAW.png");
}

这会将图像设置为您的div背景。代替此url，您可以设置本地路径。
因为您的容器是
位置：固定的
，所以我将
溢出设置为
可见的

并将伪元素添加到
.tag
元素中，以使用
border
属性创建三角形


关于形状，您可以查看因为您的容器是
位置：固定的
，所以我将
溢出
更改为
可见的
并将伪元素添加到
.tag
元素中，以使用
border
属性创建三角形


关于形状，如果将
.tag
元素设置为
overflow:visible
即可，则可以查看。然后你可以用pseudo元素@ToanLu来做，非常感谢。工作正常。如果将
.tag
元素设置为
overflow:visible
即可。然后你可以用pseudo元素@ToanLu来做，非常感谢。干得不错。