cookie技术阿蚊少迷你便签
21视频教程网3月25日整理
<!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=utf-8" />
<title>迷你便签 阿蚊少作品</title>
</head>
<body>
<script>
<!--
//欢迎大家使用我的作品，使用是请保留此版权信息谢谢合作。
/////////////////////////////////////////////
// 关于迷你便签 //
// 作者:阿蚊少 QQ:262826028 //
// E-mail:owvsty@163.com //
// 使用方法:直接调用本JS文件即可 //
/////////////////////////////////////////////
//参数设置
var YhTop = 100//设置相对上边的距离
var YhRight = 0//设置相对右边距离
var Days = 365//设置cookie保存的天
var TitleFont = "宋体"//设置便签标题字体
var TitleColor = "FFFFFF"//设置标题文本颜色
var NoteWidth =180//设置便签宽度
var NoteHeight =300 //设置便签高度
//以下不用修改
var TitleTextWidth = NoteWidth - 20//自动计算标题文本宽度
var TextAreaWidth = NoteWidth - 10//自动计算文本域宽度
var TextAreaHeight = NoteHeight - 74//自动计算文域高度
document.write("<div id=\"NoteDiv\" style=\"position:absolute;top:"+YhTop+"px;right:"+YhRight+"px;\">")
document.write("<div id=\"NoteButton\" style=\"width:30px;height:76px;font-weight:bold;font-size:15px;font-weight:bold;text-align:center;cursor:pointer;border:solid 1px #CCC;background:#69F;\" onclick=\"showBox()\">迷你便签</div>");
document.write("<div id=\"YhNote\" style=\"display:none;text-align:center;width:"+NoteWidth +"px;height:"+NoteHeight+"px;font-size:14px;font-weight:bold;background:#fff;border:solid 1px #69C;\">");
document.write("<div style=\"background:#69C;width:"+NoteWidth+"px;height:20px;border-bottom:solid 1px #ccc;margin-bottom:2px;\"><span style=\"float:left;display:block;font-family:'"+TitleFont+"';width:"+TitleTextWidth+"px;padding:2px 0 2px 0;color:#"+TitleColor+";\">迷你便签</span><span style=\"float:right;display:block;font-size:17px;color:#f00;width:20px;background:#ccc;cursor:pointer;\" onclick=\"closeBox()\" title=\"收起便签\">×</span></div>");
document.write("<textarea id=\"NoteContent\" style=\"width:"+TextAreaWidth +"px;height:"+TextAreaHeight +"px;border:solid 1px #69f;\"></textarea>");
document.write("<div></div>");
document.write("<input type=\"button\" onclick=\"save()\" value=\"保存\" />");
document.write("<input type=\"button\" onclick=\"clear1()\" value=\"清除\" />");
document.write("<div style=\"font-size:12px;border:0;width:120px;height:14px;\" title=\"本功能使用Cookies技术 请勿禁用Cookies\">使用Cookies技术</div>");
document.write("</div>");
document.write("</div>");
//获取全局对象 /*由于之前使用 document.all(ID)造成FF不能使用*/
var NoteDiv = document.getElementById('NoteDiv')//最外围容器
var NoteButton = document.getElementById('NoteButton')//按钮
var NoteBox = document.getElementById('YhNote')//盒子
var NoteTextArea = document.getElementById('NoteContent')//文本域
//操作涵数 cookie操作
function SetCookie(name,value)//两个参数，一个是cookie的名子，一个是值
{
var exp = new Date(); //new Date("December 31, 9998");
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getCookie(name)//取cookies函数
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null) return unescape(arr[2]); return null;
}
//显示便签
function showBox(){
var content = getCookie('NoteCokie')//读取Cookie
if(content==null){
content = ''
}
NoteTextArea.innerHTML = content//给文本域赋值
NoteButton.style.display = 'none'//隐藏打开按钮
NoteBox.style.display='block'//显示盒子
}
//隐藏便签
function closeBox() {
save()//关闭时自动保存
NoteButton.style.display = 'block'//显打开按钮
NoteBox.style.display='none'//隐藏
}
//保存涵数
function save(){
SetCookie('NoteCokie',NoteTextArea.innerHTML)
}
//清空涵数
function clear1(){
NoteTextArea.innerHTML=''
save()
}
//定位便签
function ResetNoteDiv(){
NoteDiv.style.top = parseInt(document.documentElement.scrollTop,10)+YhTop + "px";//如果后面不加 px 在FF下不能使用
}
//重定位便签
window.onresize = ResetNoteDiv
window.onscroll = ResetNoteDiv
//当用户自行关闭浏览器时，为防止数据失丢，自动实现保存
window.onunload = save
//-->
</script>
<br />
<br />
<br />
<br />
<br />
<br />
<br />1222222222222222
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />122222222222222222
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />1222222222222
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />21222222222222222
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />122222222222222
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</body>
</html>
JavaScript教程/编
QQ：2693987339(点击联系)购买教程光盘
:
