jquery右下角弹出提示框示例代码


Posted in Javascript onOctober 08, 2013
<!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" /> 
<script language="javascript" src="http://www.chinahds.com/js/jquery-1.8.2.min.js" ></script> 
<title>弹出提示框右下角显示</title> 
<style type="text/css"> 
body{ margin:0px;padding:0px; height:5000px; } 
.botk{right:5px;position:fixed;width:100px;_position:absolute; _top: expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight); z-index:999; height:100px;filter: Alpha(opacity=90);-moz-opacity:.9;opacity:0.9;background:#ffffff; color:#ffffff; bottom:5px;} 
.botts{width:100px; height:100px; position:absolute; z-index:9999;background:#000000;} 
#adclose{width:20px; height:20px; position:absolute; cursor:pointer; z-index:99999} 
</style> 
<script type="text/javascript"> 
$(document).ready(function(e) { 
/* var wintopfir=$(window).height()+$(window).scrollTop(); 
var wintopsec=wintopfir-100;*/ 
var wintopfir=$(".botk").height(); 
var wintopsec=wintopfir-100; 
$("#bottomad").css({top:wintopfir+"px"}); 
$("#bottomad").animate({top:wintopsec+"px" }, 2000); 
$("#adclose").click( function () { $("#bottomad").hide(); }); 
}); </script> 
</head> 
<body> 
<div class="botk"> 
<div id="bottomad" class="botts"> 
<div id="adclose">X</div> 
一个jquery实现的右下角慢慢弹出提示公告,学习做的。大家给意见哈。 
</div> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
通过DOM脚本去设置样式信息
Sep 19 Javascript
基于jquery的动态创建表格的插件
Apr 05 Javascript
js实现动态改变字体大小代码
Jan 02 Javascript
用JavaScript获取页面文档内容的实现代码
Jun 10 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
Feb 08 Javascript
React学习笔记之条件渲染(一)
Jul 02 Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
Jul 27 Javascript
详解VUE2.X过滤器的使用方法
Jan 11 Javascript
微信小程序当前时间时段选择器插件使用方法详解
Dec 28 Javascript
使用js在layui中实现上传图片压缩
Jun 18 Javascript
通过vue写一个瀑布流插件代码实例
Sep 07 Javascript
浅谈vue3中effect与computed的亲密关系
Oct 10 Javascript
让复选框只能选择一项的方法
Oct 08 #Javascript
js中的push和join方法使用介绍
Oct 08 #Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
Oct 08 #Javascript
Firefox和IE兼容性问题及解决方法总结
Oct 08 #Javascript
JQuery中form验证出错信息的查看方法
Oct 08 #Javascript
jquery $(this).attr $(this).val方法使用介绍
Oct 08 #Javascript
Javascript表格翻页效果的具体实现
Oct 05 #Javascript
You might like
PHPMailer邮件类利用smtp.163.com发送邮件方法
2008/09/11 PHP
ThinkPHP实现一键清除缓存方法
2014/06/26 PHP
Smarty环境配置与使用入门教程
2016/05/11 PHP
PHP封装curl的调用接口及常用函数详解
2018/05/31 PHP
PHP PDOStatement::debugDumpParams讲解
2019/01/30 PHP
Extjs学习笔记之四 工具栏和菜单
2010/01/07 Javascript
ExtJs使用IFrame的实现代码
2010/03/24 Javascript
深入理解JavaScript系列(11) 执行上下文(Execution Contexts)
2012/01/15 Javascript
js实现图片轮换效果代码
2013/04/16 Javascript
js判读浏览器是否支持html5的canvas的代码
2013/11/18 Javascript
Javascript控制input输入时间格式的方法
2015/01/28 Javascript
批量下载对路网图片并生成html的实现方法
2016/06/07 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
2016/07/20 Javascript
jQuery实现将div中滚动条滚动到指定位置的方法
2016/08/10 Javascript
js判断radiobuttonlist的选中值显示/隐藏其它模块的实现方法
2016/08/25 Javascript
yarn与npm的命令行小结
2016/10/20 Javascript
浅谈Angular2 ng-content 指令在组件中嵌入内容
2017/08/18 Javascript
浅谈webpack打包过程中因为图片的路径导致的问题
2018/02/21 Javascript
浅谈Vuex注入Vue生命周期的过程
2019/05/20 Javascript
Python+OpenCV让电脑帮你玩微信跳一跳
2018/01/04 Python
Python cv2 图像自适应灰度直方图均衡化处理方法
2018/12/07 Python
python 3.3 下载固定链接文件并保存的方法
2018/12/18 Python
Python多线程原理与用法实例剖析
2019/01/22 Python
如何在Django项目中引入静态文件
2019/07/26 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
Python编程快速上手——强口令检测算法案例分析
2020/02/29 Python
django ORM之values和annotate使用详解
2020/05/19 Python
使用python把xmind转换成excel测试用例的实现代码
2020/10/12 Python
css3中less实现文字长阴影(long shadow)
2020/04/24 HTML / CSS
大学生专业个人学习的自我评价
2013/10/26 职场文书
学校联谊协议书
2014/09/16 职场文书
环境工程专业毕业生求职信
2014/09/30 职场文书
市场部岗位职责范本
2015/04/15 职场文书
工作表现证明
2015/06/15 职场文书
python如何利用traceback获取详细的异常信息
2021/06/05 Python
Win11 Build 21996.1 Dev版怎么样? win11系统截图欣赏
2021/11/21 数码科技