jquery-div提示框渐隐弹出与隐藏
jQuery 隐藏 div 弹出 提示框
2023-09-11 14:21:57 时间
<!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">
<title>jquery div提示框渐隐弹出与隐藏</title>
<script type="text/javascript" src="jquery.min.js"></script>
<style>
* {
margin: 0;
padding: 0;
font-size: 12px;
}
input {
width: 120px;
height: 30px;
cursor: pointer;
}
#note {
position: absolute;
width: 400px;
padding: 20px;
background: #eee;
border: 1px solid #ccc;
left: 40%;
z-index: 9999;
display: none;
}
</style>
<script>
$(function () {
$('input').click(function () {
if (!$('#note').is(':visible')) {
$('#note').css({display: 'block', top: '-100px'}).animate({top: '+100'}, 500, function () {
setTimeout(out, 3000);
});
}
});
});
function out() {
$('#note').animate({top: '0'}, 500, function () {
$(this).css({display: 'none', top: '-100px'});
});
}
</script>
</head>
<body>
<div id="note"><a href="http://www.jb51.net" target="_blank">脚本之家</a></div>
<input type="button" value="点我,30s后消失">
</body>
</html>
相关文章
- Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)
- 【Jquery】jQuery获取URL參数的两种方法
- jQuery,JQ显示与隐藏
- Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的使用方法总结
- jquery之超简单的div显示和隐藏特效demo(转)
- jQuery选择器
- 《jQuery UI 开发指南》——1.4 在HTML页面中应该引入哪些文件
- 《jQuery移动开发》—— 1.3 小结
- 《jQuery、jQuery UI及jQuery Mobile技巧与示例》——9.3 技巧:更改标题元素
- jQuery验证控件jquery.validate.js的使用介绍
- jquery.validate.js校验select2解决方案,Jquery插件select2校验解决方案
- Nice Jquery Validator 【从 jQuery Validation 迁移】
- jQuery全屏滚动插件FullPage.js中文API文档
- jquery 获取没有class/id的元素!!!
- jquery获取select选择的文本与值
- jquery中attr和prop的区别
- jquery.validate.js 应用示例
- JQuery在一个简单的表单验证的例子
- JQuery采纳CSS实现DOM显示和隐藏要素
- js和jquery判断事件流
- jquery-div提示框渐隐弹出与隐藏
- jQuery效果-隐藏与显示 小方块的移除
- jQuery效果-隐藏与显示
- jquery datatable显示隐藏子表