右下角弹出框

<!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=utf-8" /> <title>无标题文档</title>

<style type="text/css">     #winpop { width:200px; height:0px; position:absolute; right:5px; bottom:5px; border:1px solid #999999; margin:0; padding:1px; overflow:hidden; display:none; background:url(http://www.niutw.com/images/bg.png) #FFFFFF}     #winpop .title { width:100%; height:20px; line-height:20px; background:#FFCC00; font-weight:bold; text-align:center; font-size:12px;}     #winpop .con { width:100%; height:80px; line-height:80px; font-weight:bold; font-size:12px; color:#FF0000; text-decoration:underline; text-align:center}     #silu { font-size:13px; color:#999999; position:absolute; right:0; text-align:right; text-decoration:underline; line-height:22px;}     .close { position:absolute; right:4px; top:-1px; color:#FFFFFF; cursor:pointer}     </style>     <script type="text/javascript">     function tips_pop(){     var MsgPop=document.getElementById("winpop");//获取窗口这个对象,即ID为winpop的对象     var popH=parseInt(MsgPop.style.height);//用parseInt将对象的高度转化为数字,以方便下面比较     if (popH==0){         //如果窗口的高度是0     MsgPop.style.display="block";//那么将隐藏的窗口显示出来     show=setInterval("changeH(‘up‘)",20);//开始以每0.002秒调用函数changeH("up"),即每0.002秒向上移动一次     }     else {         //否则     hide=setInterval("changeH(‘down‘)",20);//开始以每0.002秒调用函数changeH("down"),即每0.002秒向下移动一次     }     }     function changeH(str) {     var MsgPop=document.getElementById("winpop");     var popH=parseInt(MsgPop.style.height);     if(str=="up"){     //如果这个参数是UP     if (popH<=100){    //如果转化为数值的高度小于等于100     MsgPop.style.height=(popH+4).toString()+"px";//高度增加4个象素     }     else{     clearInterval(show);//否则就取消这个函数调用,意思就是如果高度超过100象度了,就不再增长了     }     }     if(str=="down"){     if (popH>=4){       //如果这个参数是down     MsgPop.style.height=(popH-4).toString()+"px";//那么窗口的高度减少4个象素     }     else{        //否则     clearInterval(hide);    //否则就取消这个函数调用,意思就是如果高度小于4个象度的时候,就不再减了     MsgPop.style.display="none";  //因为窗口有边框,所以还是可以看见1~2象素没缩进去,这时候就把DIV隐藏掉     }     }     }     window.onload=function(){    //加载     document.getElementById(‘winpop‘).style.height=‘0px‘;//我不知道为什么要初始化这个高度,CSS里不是已经初始化了吗,知道的告诉我一下     setTimeout("tips_pop()",800);     //3秒后调用tips_pop()这个函数     }     </script>

</head>         <div id="silu">     <button onclick="tips_pop()">测试按钮</button>     </div>     <div id="winpop">     <div class="title">您有新的消息<span class="close" onclick="tips_pop()">X</span></div>     <div class="con">你有未读信息(1)</div>     </div> </body> </html>

时间： 2024-11-07 04:01:14

右下角弹出框的相关文章

系统右下角弹出升级Windows10的升窗

这几天收到用户反馈,系统右下角弹出提示升级Windows10的升窗框,用户感觉很烦恼.经过排查,确定为QQ的推广.推广的时候,会在客户机C:\Users\Administrator\AppData\Roaming目录下,生成一个WIN10TIPS0623V1.EXE的执行文件,然后此执行文件便会在登录QQ十分钟后弹出提示Windows10升级提示框.如图:       解决办法:在云更新安全中心,将此进程拦截即可.进程名:WIN10TIPS0623V1.EXE 特征码:489CA1015783E

jQuery layer[页面弹出框]

常见接口如下: 方法名 描述 $.layer({}) 核心接口,参数是一个对象,对象属性参见上述列表.诸如layer.alert()之类的为$.layer()的包装方法. layer.v 获取版本号. layer.ready(callback) layer中的样式文件装载完毕后执行的方法,一般用于页面加载时调用layer,这样可避免样式未加载即调用层导致的错乱. 示例: layer.ready(function(){ layer.msg('Hello Layer'); }); layer.ale

ymPrompt框架。（弹出框）

JS弹出窗.弹出层组件,ymPrompt V4.0使用简介(转) ymPrompt从最简单的1.0版本到现在的4.0版本,代码共经历了四次较大的改动,组件在功能上有了很大的改进,应用灵活 度更大,可应用环境的环境更加广泛,特别在4.0版本中加入对遮罩显示隐藏.按钮/图标的自定义.组件语言的控制.窗口悬浮位置等控制功能,更加的增强了 组件的应用范围,使其不仅仅可以使用到模拟alert弹出之类的应用中,更可实现类似qq消息提示,登陆窗口,进度条等效果. 但是,任何的 事情都具有其两面性,随着功能的增

wpf 右下角弹出窗

原文:wpf 右下角弹出窗 自己写的wpf 弹出框,欢迎拍砖,动画都写在了后台代码,前台代码不太重要,用了一下iconfont,具体样式我就不贴出来了,本次主要是后台代码的动画 需要有父级窗口才可以使用. 前台代码: <Window x:Class="V2VReporter.Views.SystemViews.MsgPopup" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

几乎纯css实现弹出框

今天需要做一个弹出框,右下角提示的那种 ,看了一两个jquery的插件 总是不太满意 .一方面js内容太多,另一方面 不太好配合已经存在的样式使用.所以 就自己用css直接实现了下 效果还可以 . 上代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html5桌面通知</title> <style type="text/c

安卓中的弹出框

AlertDialog.Builder builder = new Builder(Context context) 得到一个context所在页面的弹出框, 可以是单选 builder.setSingleChoiceItems(items, checkedItem,listener)  items为弹出框的条目,checkedItem为默认选择的条目(一个),listener为弹出框的点击事件监听器(DialogInterface.OnClickListener的类型,是内部类), 也可以是多

Bootstrap方法为页面添加一个弹出框

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Bootstrap 实例 - 弹出框(Popover)插件</title> <link rel="stylesheet" href="https://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap

popover弹出框

<style> #view{width: 300px;height: 200px;border: 1px solid red;} </style> 以上是为了viewport更容易看出来设置的样式 <body style="margin: 50px;"> <div id="view"> <button class="btn btn-danger btn-lg" data-toogle=&quo

js 常见弹出框学习

模拟系统的弹出框 系统自带的弹出框 总结 链接  http://blog.csdn.net/anhuidelinger/article/details/17024491 参考这个网站学习模态框的动态弹出   http://tympanus.net/codrops/2013/06/25/nifty-modal-window-effects/,网站提供打包好的资源下载. html中的基本结构: <div class="md-modal md-effect-1" id="mo