添加tip
来源:互联网 发布:php分割 编辑:程序博客网 时间:2024/06/11 05:17
html:
<div id="body_2" > <br/><h1>欢迎来到极客学院</h1> <br/> <span style="margin-top: 20px"> 极客学院的及“桥接”,弥合了高校学生进入职场角色的断层问题,入职公司后可以很好的应对工作中的挑战,迅速融入技术团队完成项目整体开发。从而帮助企业更高效、有力<a id="tooltip" href="#">“纽带”</a>的建设人才梯队。一直以来我们都把极客学院作为公司的重要人才储备库资源。 </span></div>
css:
.tooltip-box{ display: block; background-color: aliceblue; line-height: 6px; border: 1px solid darkturquoise; color: #333; padding: 20px; font-size: 12px; border-radius: 5px; overflow: auto /*当内容大于框的内容时允许出现滑动条*/; position: absolute;}
js:
$(document).ready(function(){ $("#tooltip").hover(function(){ showTootip(this,"tip1","<a href='#'>sjdkaskdasjkljdkajwkjdklwj</a>",120); });});function showTootip(obj,id,html,width,height){ if(document.getElementById(id)==null){ var tooltipbox; tooltipbox=document.createElement("div"); tooltipbox.className="tooltip-box"; tooltipbox.id=id; tooltipbox.innerHTML=html; tooltipbox.style.display="block"; var boxleft=obj.offsetLeft; var boxtop=obj.offsetTop+20; tooltipbox.style.left=boxleft+"px"; tooltipbox.style.top=boxtop+"px"; obj.appendChild(tooltipbox); }else{ document.getElementById(id).style.display="block"; } obj.onmouseout=function(){ setTimeout(function(){ document.getElementById(id).style.display="none"; },400) };}
阅读全文
0 0
- 添加tip
- Tip:DataGrid 自动添加序号
- Extjs4中为组件添加tip
- 为控件添加Tip提示功能CToolTipCtrl
- tip
- Tip
- tip
- Tip:
- TIP
- Tip
- tip
- Tip
- Tip
- tip
- N2CMS 实践之路 Tip.3 自定义控件如何添加
- 为属性页中的对话框添加工具栏,及添加工具栏tool tip & Update command ui
- visual studio 2005小tip之自动添加文件模版信息
- 给grid添加tip,只需要改几个字就可以在很多地方使用
- linux 下ntp客户端协议代码实现
- DirecrShow 实时采集桌面并进行H264和AAC编码后封装成MP4保存
- ORA-12154:无法解析指定的连接标识符
- Linux中的进程
- android插件化(ContentProvider)
- 添加tip
- BZOJ 1061: [Noi2008]志愿者招募 费用流
- Cxf拦截器中获取当前请求的参数
- java 反射机制
- console.log()打印object却显示为字符串[object Object]
- java simpleMailMessage 邮件发送功能
- Dlib库【2】——Socket相关
- android各版本特性
- 小技巧:两种方式快速实现平滑涂鸦画板