On github under notifications there are avatars of the involved people. On hover the picture can all be shown. I want this but I don't find it and I don't have the first step to do that. Can somebody help me?
在通知的github上,有相关人员的头像。在悬停时,图片都可以显示。我想要这个,但我找不到它,我没有第一步这样做。有人能帮助我吗?
1 个解决方案
#1
0
so i wil not show you some code but i tell you what i would do:
所以我不会告诉你一些代码,但我告诉你我会做什么:
- create the tooltip markup with a Style containing the display: none
- add a data-id to the tooltip-markup and the img
- appand the marup to the body
- calculate the left and top position of the element you will hover
- add the position to the tooltip
- add to the img a hover-event in wich you read the data-id find the tooltip with the same data-id and set the visibility to block
使用包含display:none的Style创建工具提示标记
将data-id添加到tooltip-markup和img
应用和身体的marup
计算您将悬停的元素的左侧和顶部位置
将位置添加到工具提示
添加到img一个悬停事件,你读取data-id找到具有相同data-id的工具提示,并将可见性设置为block
#1
0
so i wil not show you some code but i tell you what i would do:
所以我不会告诉你一些代码,但我告诉你我会做什么:
- create the tooltip markup with a Style containing the display: none
- add a data-id to the tooltip-markup and the img
- appand the marup to the body
- calculate the left and top position of the element you will hover
- add the position to the tooltip
- add to the img a hover-event in wich you read the data-id find the tooltip with the same data-id and set the visibility to block
使用包含display:none的Style创建工具提示标记
将data-id添加到tooltip-markup和img
应用和身体的marup
计算您将悬停的元素的左侧和顶部位置
将位置添加到工具提示
添加到img一个悬停事件,你读取data-id找到具有相同data-id的工具提示,并将可见性设置为block