Jquery 从右上角、左上角、右下角和左下角显示/隐藏分割效果

我有一张有照片的人的名单。当我将鼠标悬停在每个项目上时，我想显示每个人的描述。
描述在另一个div中，只有当我将鼠标悬停在图像上时才能看到它

现在重点是我想从特定的角度显示description

divs

。
我曾尝试使用jQuery

show/hide

函数，但没有方向属性从角落显示它。
下面是它的显示方式：

---

为了控制动画的开始或结束角，请将“div”定位为“absolute”，并使用“left”或“right”以及“top”和“bottom”属性设置随着大小的变化哪个角保持不变

示例（css）：

将在div的右下角开始或结束动画

及

这将在div的右上角开始或结束动画，依此类推

希望这有帮助

$(".persons li.one").mouseenter(function() {
  $(this).find('div').show("slide", {
    direction: "left"
  })
});

$(".persons li.one").mouseleave(function() {
  $(this).find('div').hide("slide", {
    direction: "left"
  })
})

.persons li.one {position: absolute; bottom: 0px; right: 0px;}

.persons li.one {position: absolute; top: 0px; right: 0px;}