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 相关文章推荐
JS 显示当前日期与时间的代码
Mar 24 Javascript
JQuery index()方法使用代码
Jun 02 Javascript
jquery数组过滤筛选方法grep()简介
Jun 06 Javascript
分享一个常用的javascript静态类
Dec 31 Javascript
jQuery通过Ajax返回JSON数据
Apr 28 Javascript
JS非Alert实现网页右下角“未读信息”效果弹窗
Sep 26 Javascript
javascript实现自动填写表单实例简析
Dec 02 Javascript
JS遍历ul下的li点击弹出li的索引的实现方法
Sep 19 Javascript
javascript跨域请求包装函数与用法示例
Nov 03 Javascript
js实现HashTable(哈希表)的实例分析
Nov 21 Javascript
vue-cli脚手架-bulid下的配置文件
Mar 27 Javascript
Vue源码中要const _toStr = Object.prototype.toString的原因分析
Dec 09 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
建站常用13种PHP开源CMS比较
2009/08/23 PHP
PHP异常Parse error: syntax error, unexpected T_VAR错误解决方法
2014/05/06 PHP
微信自定义分享php代码分析
2016/11/24 PHP
PHP实现APP微信支付的实例讲解
2018/02/10 PHP
laravel5使用freetds连接sql server的方法
2018/12/07 PHP
PHP的PDO错误与错误处理
2019/01/27 PHP
JavaScript 组件之旅(三):用 Ant 构建组件
2009/10/28 Javascript
return false;和e.preventDefault();的区别
2010/07/11 Javascript
js两行代码按指定格式输出日期时间
2011/10/21 Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
2016/04/01 Javascript
微信小程序 缓存(本地缓存、异步缓存、同步缓存)详解
2017/01/17 Javascript
React Native实现地址挑选器功能
2017/10/24 Javascript
小程序实现留言板
2018/11/02 Javascript
深入浅析Vue中mixin和extend的区别和使用场景
2019/08/01 Javascript
深入webpack打包原理及loader和plugin的实现
2020/05/06 Javascript
vue data有值,但是页面{{}} 取不到值的解决
2020/11/09 Javascript
python遍历 truple list dictionary的几种方法总结
2016/09/11 Python
Python简单网络编程示例【客户端与服务端】
2017/05/26 Python
python 实现A*算法的示例代码
2018/08/13 Python
python3爬虫怎样构建请求header
2018/12/23 Python
华为2019校招笔试题之处理字符串(python版)
2019/06/25 Python
python实现串口自动触发工作的示例
2019/07/02 Python
Python编程学习之如何判断3个数的大小
2019/08/07 Python
解决Pymongo insert时会自动添加_id的问题
2020/12/05 Python
Old Navy加拿大官网:美式休闲服饰品牌
2017/09/26 全球购物
常用UNIX 命令(Linux的常用命令)
2015/12/26 面试题
电大自我鉴定
2013/10/27 职场文书
自我鉴定范文
2013/11/10 职场文书
幼儿园开学寄语
2014/04/03 职场文书
小学班干部竞选演讲稿
2014/04/24 职场文书
防灾减灾标语
2014/10/07 职场文书
煤矿隐患排查制度
2015/08/05 职场文书
技术入股协议书
2016/03/22 职场文书
聘任书的格式及模板
2019/10/28 职场文书
刚学完怎么用Python实现定时任务,转头就跑去撩妹!
2021/06/05 Python
使用ICOM IC-R9500接收机同时测评十台收音机中波接收性能
2022/05/10 无线电