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. CSS/Javascript鼠标悬停弹出框
- 5. 鼠标悬停弹出消息
- 6. 弹出DIV当鼠标悬停在单选按钮
- 7. 单张鼠标悬停通过数组列表弹出
- 8. Fadein鼠标悬停和淡出鼠标
- 9. jQuery悬停鼠标悬停/鼠标退出计时
- 10. 突出鼠标悬停表
- 11. PrototypeJS鼠标悬停菜单
- 12. 鼠标悬停
- 13. 鼠标悬停
- 14. 问题与鼠标悬停,鼠标移出在JQuery的菜单
- 15. 悬停弹出悬停
- 16. Openlayers 3弹出鼠标悬停在标记上
- 17. 暂停jQuery悬停(鼠标悬停)
- 18. 反应传单弹出不工作,鼠标悬停时光标不会改变
- 19. KineticJS鼠标悬停
- 20. appendchild鼠标悬停
- 21. Div鼠标悬停
- 22. jQuery的鼠标悬停不隐藏元素,如果鼠标在弹出窗口
- 23. jcarousel停在鼠标悬停
- 24. 将鼠标悬停在某个单词上并按需更换
- 25. jQuery 1.4.2悬停方法:鼠标悬停并将鼠标移出问题
- 26. 鼠标悬停在HTML功能弹出或放大图片
- 27. Flash Builder + Eclipse:禁用鼠标悬停弹出?
- 28. 鼠标悬停功能不会创建弹出窗口
- 29. 没有超链接的li鼠标悬停的图像弹出?
- 30. 将鼠标悬停在Tkinter弹出框上
与跨度和.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