本实例使用Javascript实现右下角可关闭最小化div，可以用于展示推荐内容，效果预览网址：http://keleyi.com/keleyi/phtml/xuanfudiv/3.htm
效果图片：

完整源代码：

 <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <title>js实现右下角可关闭最小化div--柯乐义</title>

 <script src="http://keleyi.com/keleyi/phtml/xuanfudiv/3/msg.js" type="text/javascript"></script>

 <style type="text/css" media="screen">

 /* 右下角跳出的广告 */

 #downmsg_emessage{POSITION: fixed;_position:absolute; z-index:100; bottom:0;right:0; background:url(http://keleyi.com/keleyi/phtml/xuanfudiv/3/down_msg_bg.gif) no-repeat left top;width:225px;}

 #donwmsg_head{float:left; display:inline; font-size:12px;color:#FFFFFF;margin-left: 26px;margin-top: 6px;}

 #downmsgBar .close{float:right;width:11px;height:11px;margin-top:6px;display:block;margin-right:5px;}

 #downmsgBar{height:25px;}

 #donwmsg_content{height:162px;overflow:hidden;}

 #donwmsg_content ul{font-size:12px;color:#007cc1;    top: 0px;padding:0px 2px 0 6px;left: 6px;line-height:180%; height:110px; overflow:hidden;}

 #donwmsg_content ul li{background:url(http://keleyi.com/keleyi/phtml/xuanfudiv/3/down_msg_bg.gif) no-repeat -100px -245px;text-indent:13px;}

 #donwmsg_content ul li a{color:#007cc1;}

 #donwmsg_content ul .ll a{color:#a10000;font-weight:bold;}

 #donwmsg_content p{position:absolute;left: 13px;top: 157px;}

 #donwmsg_content .lb{padding:0px; text-align:center;}

 #donwmsg_content .lb a{font-size:12px;color:Blue}

 a.msg-hidden-btn-2{width:11px; height:11px;overflow:hidden;float:right;display:block;margin-right:5px;margin-top:6px;background:url(http://keleyi.com/keleyi/phtml/xuanfudiv/3/down_msg_bg.gif) no-repeat -0px -250px;}

 a.msg-hidden-btn-1{ width:11px; height:11px;overflow:hidden;float:right;display:block;margin-right:5px;margin-top:6px;background:url(http://keleyi.com/keleyi/phtml/xuanfudiv/3/down_msg_bg.gif) no-repeat -50px -250px;}

 </style>

 </head>

 <body>

 <div id="downmsg_emessage" style="DISPLAY: block">

 <div id="downmsgBar">

 <div id="donwmsg_head">柯乐义推荐内容</div><a class="close" href="javascript:closeDiv()"></a><a class="msg-hidden-btn-1" id="msg_hidden_btn" href="javascript:showHideDiv()">&nbsp;</a></div>

 <div id="donwmsg_content" style="DISPLAY: block; HEIGHT: 162px">

 <ul>

 <li class="ll"><a href="http://keleyi.com/a/bjac/768f469b95b61487.htm" >单行文字间歇向上滚动</a></li>

 <li><a href="http://keleyi.com/a/bjac/a6d651710217f7a0.htm" >jQuery UI修饰title气泡</a></li>

 <li><a href="http://keleyi.com/a/bjac/bf0eb8c02085b10d.htm" >jquery清空textarea等输入框</a></li>

 <li><a href="http://keleyi.com/a/bjac/939631bb07adb4dc.htm" >jquery关灯特效</a></li>

 <li><a href="http://keleyi.com/a/bjac/7e8897e5ec0849e9.htm" >可改变大小DIV层</a></li>

 </ul>

 <div class="lb"><a href="http://keleyi.com/menu/jquery/" target="_blank">jQuery</a> 　 <a href="http://keleyi.com/menu/javascript/" target="_blank">Javascript</a> 　 <a href="http://keleyi.com/menu/cms/" target="_blank">CMS</a> </div>

 </div>

 </div>

 </body>

 </html>

文本转载自柯乐义： http://keleyi.com/a/bjac/4r5tcg7v.htm

js实现右下角可关闭最小化div的更多相关文章

  1. 2017年11月20日 WinForm窗体 窗口无边框可移动&&窗口阴影 控制窗口关闭/最小化

    弹框 MessageBox.Show(); 清空 clear() 字符串拼接 string 公共控件 button 按钮 checkbox 复选框 checklistbox 多个复选框 combobo ...

  2. JS网站右下角悬浮视窗可关闭广告

    效果体验:http://hovertree.com/texiao/js/4.htm 网站右下角悬浮视窗可关闭广告代码,可收缩.展开,关闭,内容区可自定义html,兼容IE8+.FireFox.Chro ...

  3. JS实现漂亮的窗口拖拽效果(可改变大小、最大化、最小化、关闭)

    转自<JS实现漂亮的窗口拖拽效果(可改变大小.最大化.最小化.关闭)>:http://www.jb51.net/article/73157.htm   这篇文章主要介绍了JS实现漂亮的窗口 ...

  4. C# 设置程序最小化到任务栏右下角，鼠标左键单击还原，右键提示关闭程序

    首先设置程序最小化到任务栏右下角 先给窗口添加一个notifyIcon控件 为notifyIcon控件设置ICO图标(不设置图标将无法在任务栏显示) 给notifyIcon控件添加点击事件 然后是最小 ...

  5. 转 原生js canvas实现苹果电脑mac OS窗口最小化效果

    http://www.17sucai.com/pins/demo-show?id=2459 http://www.17sucai.com/pins/demo-show?id=2458  很多资料 ,前 ...

  6. js写的数码时钟，在“最小化”浏览器 或者 “切换网页”是动画效果好像不对

    一.问题 在“最小化”浏览器 或者 “切换网页”是动画效果不对,不知道哪里出了问题???是不是”最小化“时网页定时器关掉了,还是其他什么原因啊 ???? 二.HTML代码如下 <div id=& ...

  7. iPhone手机解锁效果&&自定义滚动条&&拖拽--Clone&&窗口拖拽（改变大小/最小化/最大化/还原/关闭）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. nw.js自定义最小化图标的click事件

    选择frameless时,最小化和关闭按钮的点击事件需要自己来做,办法是: /* * 下面两个模块一定要引入到js文件中 */ var gui = require('nw.gui'); var win ...

  9. IE6及以上版本fixed问题解决方案，页面右下角固定页面，可以最大化、最小化、正规显示

    在窗口固定位置显示内容使用fixed,但是 IE 6 不支持,后来我搜了很多方法,都没有作用,后来类比着一个网站的代码,使用absolute .z-index解决了问题. 页面div结构: <d ...

随机推荐

  1. 解决OracleConnection ORA-1017 和 HRESULT:0x8007000B 错误

    试图加载格式不正确的程序. (异常来自HRESULT:0x8007000B) 解决方案: IIS下 winform下: ORA-1017 错误

  2. PHP面向对象

    面向对象 1.类由众多的对象抽象出来的    2.对象    一起皆对象    由类实例化出来的 求两个圆之间阴影的面积 $sr1=10; $sr2=5; $mj=3.14*$sr1*$sr1-3.1 ...

  3. CI Weekly #3 | 关于微服务、Docker 实践与 DevOps 指南

    CI Weekly 围绕『 软件工程效率提升』 进行一系列技术内容分享,包括国内外持续集成.持续交付,持续部署.自动化测试. DevOps 等实践教程.工具与资源,以及一些工程师文化相关的程序员 Ti ...

  4. C#设计模式-装饰者模式

    在软件开发中,我们经常想要对一类对象添加不同的功能,例如要给手机添加贴膜,手机挂件,手机外壳等,如果此时利用继承来实现的话,就需要定义无数的类,如StickerPhone(贴膜是手机类).Access ...

  5. [erl] erlang 进程注册和注销

    想要注册一个进程,必须先要创建一个进程. 如何创建一个进程,可以使用spawn.spawn_link,它们虽然都能创建进程,但是也有微妙的区别: 1)当前进程中创建一个并行进程,当被生成的进程崩溃时, ...

  6. MySQL 查看表结构简单命令

    一.简单描述表结构,字段类型 desc tabl_name; 显示表结构,字段类型,主键,是否为空等属性,但不显示外键. 例如:desc table_name 二.查询表中列的注释信息 select ...

  7. Socket实现仿QQ聊天（可部署于广域网）附源码（4）-加入数据库系统搭建完成

    1.前言 这是本系列的第四篇文章,上一篇我们讲到实现了客户端对客户端的抖屏与收发各种类型文件,本篇文章我们加入SQLServer数据库实现登录与好友的添加等功能,并对界面做了美化处理.向往常一样我会把 ...

  8. 【WP开发】加密篇：双向加密

    说起双向加密,如果以前在.NET开发中弄过加/解密的朋友都不会陌生,常用的算法有DES.AES等.在RT应用程序中,也提供了加密相关的API,算法自然是一样的,只是API的封装方式不同罢了,因为RT不 ...

  9. WPF Datagrid删除一行

    private void btnDel_Click(object sender, RoutedEventArgs e) { if (DGUser.SelectedItem != null) { Dat ...

  10. TSQL语句练习题

    1. 查询Student表中的所有记录的Sname.Ssex和Class列. select Sname,Ssex,Class from Student 2. 查询教师所有的单位即不重复的Depart列 ...