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 相关文章推荐
jquery入门—选择器实现隔行变色实例代码
Jan 04 Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
May 07 Javascript
jquery实现从数组移除指定的值
Jun 24 Javascript
D3.js实现散点图和气泡图的方法详解
Sep 21 Javascript
全面解析node 表单的图片上传
Nov 21 Javascript
vue使用watch 观察路由变化,重新获取内容
Mar 08 Javascript
jQuery日程管理控件glDatePicker用法详解
Mar 29 jQuery
canvas实现弧形可拖动进度条效果
May 11 Javascript
javascript按顺序加载运行js方法
Dec 01 Javascript
JavaScript单线程和任务队列原理解析
Feb 04 Javascript
基于js实现逐步显示文字输出代码实例
Apr 02 Javascript
react PropTypes校验传递的值操作示例
Apr 28 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
短波收音机简介
2021/03/01 无线电
PHP FOR MYSQL 代码生成助手(根据Mysql里的字段自动生成类文件的)
2011/07/23 PHP
PHP面向对象精要总结
2014/11/07 PHP
php格式输出文件var_export函数实例
2014/11/15 PHP
PHP向浏览器输出内容的4个函数总结
2014/11/17 PHP
PDO操作MySQL的基础教程(推荐)
2017/08/18 PHP
Yii2 queue的队列使用详解
2019/07/19 PHP
Laravel 自定命令以及生成文件的例子
2019/10/23 PHP
PHP设计模式之装饰器(装饰者)模式(Decorator)入门与应用详解
2019/12/13 PHP
Javascript中的this绑定介绍
2011/09/22 Javascript
javascript之典型高阶函数应用介绍
2013/01/10 Javascript
jQuery图片播放8款精美插件分享
2013/02/17 Javascript
JS实现可直接显示网页代码运行效果的HTML代码预览功能实例
2015/08/06 Javascript
关于JavaScript的变量的数据类型的判断方法
2015/08/14 Javascript
简单的js计算器实现
2016/10/26 Javascript
详解微信小程序开发之城市选择器 城市切换
2017/01/17 Javascript
AugularJS从入门到实践(必看篇)
2017/07/10 Javascript
JavaScript贪吃蛇小组件实例代码
2017/08/20 Javascript
vue实现的上传图片到数据库并显示到页面功能示例
2018/03/17 Javascript
vue项目部署上线遇到的问题及解决方法
2018/06/10 Javascript
简单实现节流函数和防抖函数过程解析
2019/10/08 Javascript
JS实现随机抽选获奖者
2019/11/07 Javascript
js实现弹幕飞机效果
2020/08/27 Javascript
[02:08]DOTA2英雄基础教程 马格纳斯
2014/01/17 DOTA
Python中用于去除空格的三个函数的使用小结
2015/04/07 Python
Python遍历zip文件输出名称时出现乱码问题的解决方法
2015/04/08 Python
在Python中使用next()方法操作文件的教程
2015/05/24 Python
使用py2exe在Windows下将Python程序转为exe文件
2016/03/04 Python
Python中的全局变量如何理解
2020/06/04 Python
环境工程专业自荐信
2014/03/03 职场文书
国贸专业的职业规划书
2014/03/15 职场文书
诚信的演讲稿范文
2014/05/12 职场文书
公司员工宿舍管理制度
2015/08/03 职场文书
委托开发合同书(标准版)
2019/08/07 职场文书
Springboot如何使用logback实现多环境配置?
2021/06/16 Java/Android
Windows Server 2008 修改远程登录端口以及配置防火墙
2022/04/28 Servers