JS所谓的享元模式-->
运行下面代码
<!DOCTYPE html> <html> <head> <title></title> </head> <body> <style> .tooltip { width:300px; height:300px; background:#f00; } </style> <script> var TooltipManager = (function(){ var storedInstance = null; var Tooltip = function(){ this.delayTimeout = null; this.delay = 1500; this.element = document.createElement('div'); this.element.style.display = 'none'; this.element.style.position = 'absolute'; this.element.className = 'tooltip'; document.getElementsByTagName('body')[0].appendChild(this.element); }; Tooltip.prototype = { startDelay : function(e,text){ if(this.delayTimeout == null){ var that = this; var x = e.clientX; var y = e.clientY; this.delayTimeout = setTimeout(function(){ that.show(x,y,text); },this.delay) } }, show : function(x,y,text){ clearTimeout(this.delayTimeout); this.delayTimeout = null; this.element.innerHTML = text; this.element.style.left = x + 'px'; this.element.style.top = (y+20) + 'px'; this.element.style.display = 'block'; }, hide : function(){ clearTimeout(this.delayTimeout); this.delayTimeout = null; this.elements.style.display = 'none'; } }; return { addTooltip : function(targetElement,text){ var tt = this.getTooltip(); addEvent(targetElement,'mouseover',function(e){ tt.startDelay(e,text)}); addEvent(targetElement,'mouseout',function(e){ tt.hide()}) }, getTooltip : function(){ if(storedInstance == null){ storedInstance = new Tooltip(); }; return storedInstance; } } }()) </script> </body> </html>
直接上代码了
天道酬勤
本文作者:方方和圆圆
本文链接:https://www.cnblogs.com/diligenceday/p/3428020.html
版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试?测试工程师会被淘汰吗?