Q
弹出鼠标悬停单词
0
A
回答
4
有很多插件可以帮助你实现你正在寻找的东西。但是也可以自己实现这个功能。如果您遇到的某些插件也使用类似的代码,我也不会感到惊讶。
以下是我尝试揭开工具提示/弹出式插件行为的秘密。
您可以将所需的单词包装在<span>
元素中,并给它一个.hover
类。
<div>
This is some text with a <span class="hover">special</span>
word that has hovercraft capabilities.
</div>
你的jQuery(ver 1.7+)将是这个样子:
$(".hover").on('mouseenter',function(){
// The popup must be shown here (mouse is over element).
}).on('mouseleave',function(){
// The popup must be hidden here (mouse has left element).
});
我要补充在这里,我使用jQuery的伟大,但有时会忘记能力被称为“链接”。 on()
函数实际上返回它所连接的对象。在这种情况下,$(".hover")
- 所以如果我想调用该对象的另一个函数,我可以在最后添加它作为另一个函数。另外一个例子是:
$("#myElement").text("An error has occured!").css("color","#FF0000");
这行代码也将在文本#myElement
也变成红色。
关于您的实际弹出 - 我建议两两件事:
- 有在您的标记底部的元素(最后写了这么指数最高的 - 或者手动设置最高的z-index )
- 您也可以在应该触发弹出窗口的元素旁边的隐藏元素中显示弹出窗口。
2
你以后听起来像是一个'工具提示'。
使用jQuery的解决方案有些涉及 - 所以我只是引导你到外部资源。
可能的解决方案:
相关问题
- 1. 鼠标悬停弹出
- 2. 弹出标签时鼠标悬停
- 3. 鼠标悬停弹出消息
- 4. 鼠标悬停在vb.net弹出图表
- 5. 鼠标悬停弹出屏幕截图
- 6. 弹出鼠标悬停图像
- 7. 制作文本弹出鼠标悬停
- 8. CSS/Javascript鼠标悬停弹出框
- 9. 弹出DIV当鼠标悬停在单选按钮
- 10. 单张鼠标悬停通过数组列表弹出
- 11. 内联菜单出现鼠标悬停
- 12. Fadein鼠标悬停和淡出鼠标
- 13. jQuery悬停鼠标悬停/鼠标退出计时
- 14. 超时鼠标悬停和鼠标悬停下拉菜单?
- 15. 突出鼠标悬停表
- 16. 激活定时鼠标悬停后的弹出式菜单,然后在鼠标悬停后取消激活
- 17. PrototypeJS鼠标悬停菜单
- 18. 鼠标悬停子菜单
- 19. 鼠标悬停
- 20. 鼠标悬停
- 21. 鼠标悬停
- 22. 鼠标悬停
- 23. 问题与鼠标悬停,鼠标移出在JQuery的菜单
- 24. 悬停弹出,与菜单
- 25. 悬停弹出悬停
- 26. Openlayers 3弹出鼠标悬停在标记上
- 27. jQuery - 悬停弹出直到鼠标移出
- 28. 暂停jQuery悬停(鼠标悬停)
- 29. 反应传单弹出不工作,鼠标悬停时光标不会改变
- 30. Kinetic.Line鼠标悬停
与跨度和.hover它似乎没有它工作。 – 2012-03-17 13:39:33
我的代码,因为它在这里不会给你的功能 - 你必须插入你想要使用的弹出式HTML,然后切换这些元素在这些'mouseenter/mouseleave'回调中的可见性...... – Lix 2012-03-17 13:41:44
是你吗包括一个jQuery库? – Robert 2012-03-17 13:42:08