JS模仿MSN右下角弹出提示框代码

更新时间：2010年09月17日 09:00:43 作者：

JS模仿MSN右下角弹出提示框代码，需要的朋友可以参考下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>aa</title> <style type="text/css"> * { margin: 0px; padding: 0px; } html, body { height: 100%; } body { font-size: 14px; line-height: 24px; } #tip { position: absolute; right: 0px; bottom: 0px; height: 0px; width: 180px; border: 1px solid #CCCCCC; background-color: #eeeeee; padding: 1px; overflow: hidden; display: none; font-size: 12px; z-index: 10; } #tip p { padding: 6px; } #tip h1, #detail h1 { font-size: 14px; height: 25px; line-height: 25px; background-color: #0066CC; color: #FFFFFF; padding: 0px 3px 0px 3px; filter: Alpha(Opacity=100); } #tip h1 a, #detail h1 a { float: right; text-decoration: none; color: #FFFFFF; } </style> <script type="text/javascript"> window.onload=function() { var divTip = document.createElement("div"); divTip.id="tip"; divTip.innerHTML="<h1><a href='javascript:void(0)' onclick='start()'>×</a>asdf</h1><p><a href='javascript:void(0)' onclick='showwin()'>asdf</a></p>"; divTip.style.height='0px'; divTip.style.bottom='0px'; divTip.style.position='fixed'; document.body.appendChild(divTip); } var handle; function start(count) { var obj = document.getElementById("tip"); if (parseInt(obj.style.height)==0) { obj.style.display="block"; handle = setInterval("changeH('up')",20); }else { handle = setInterval("changeH('down')",20) } } function changeH(str) { var obj=document.all?document.all["tip"] : document.getElementById("tip"); if(str=="up") { if (parseInt(obj.style.height)>100) clearInterval(handle); else obj.style.height=(parseInt(obj.style.height)+8).toString()+"px"; } if(str=="down") { if (parseInt(obj.style.height)<8) { clearInterval(handle); obj.style.display="none"; } else obj.style.height=(parseInt(obj.style.height)-8).toString()+"px"; } } function showwin() { document.getElementsByTagName("html")[0].style.overflow = "hidden"; start(); window.open("http://tools.jb51.net"); } </script> </head> <body> <a href="javascript:void(0)" onclick="start()">click</a> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

JS身份证信息验证正则表达式
很多时候我们都是通过一组正则表达式来判断用户输入的身份证是否合法，那在用正则表达式判断之前，首先要做到的是对身份证信息的一些效验规则
2017-06-06
ES6对象操作实例详解
这篇文章主要介绍了ES6对象操作,结合实例形式详细分析了ES6对象创建、赋值、比较、合并等相关操作技巧与注意事项,需要的朋友可以参考下
2020-05-05
Javascript中的Callback方法浅析
这篇文章主要介绍了Javascript中的Callback方法浅析,本文讲解了什么是callback、Javscript Callback、Callback是什么、Callback实例等内容,需要的朋友可以参考下
2015-03-03
javascript中的return和闭包函数浅析
这篇文章主要介绍了javascript中的return和闭包函数浅析,至少可以让你搞懂那么多()是什么意思,需要的朋友可以参考下
2014-06-06
Alova.js现代化请求库使用指南
alova.js 是一个基于 Promise 的轻量级 HTTP 请求库,它提供了简单而强大的 API 来处理前端的 HTTP 请求,它的设计目标是简化开发者在前端进行 HTTP 请求的过程,提供更好的开发体验和更高的效率,本文给大家详细介绍了Alova.js现代化请求库的使用,需要的朋友可以参考下
2025-03-03
js实现三角形粒子运动
这篇文章主要为大家详细介绍了js实现三角形粒子运动，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-09-09
JavaScript数据结构之双向链表和双向循环链表的实现
本篇文章主要介绍了JavaScript数据结构之双向链表和双向循环链表的实现，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-11-11
js select支持手动输入功能实现代码
这篇文章主要介绍了js select支持手动输入实现代码,需要的朋友可以参考下
2023-05-05
javascript firefox 自动加载iframe 自动调整高宽示例
iframe 自动获取onload高宽以及iframe 自动加载，具体实现如下，感兴趣的朋友可以参考下
2013-08-08
JavaScript检测浏览器是否支持CSS变量代码实例
这篇文章主要介绍了JavaScript检测浏览器是否支持CSS变量代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2020-04-04

JS模仿MSN右下角弹出提示框代码

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具