jQuery顶部可关闭提示框代码

版权：原创更新时间：1年以上

[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 jQuery顶部可关闭提示框代码的示例演示效果:

当前平台(PC电脑)

平台:

整屏预览

部分效果截图:

HTML代码(index.html):

<!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" />
<meta name="keywords" content="JS代码,其他代码,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为jQuery顶部可关闭提示框代码，属于站长常用代码" />
<title>jQuery顶部可关闭提示框代码</title>
<link rel="stylesheet" href="css/lrtk.css" type="text/css" media="screen"/>
<script type="text/javascript" src="js/cookies.min.js"> </script>
<script type="text/javascript" src="js/jquery.min.js"> </script>
</head>
<body>
<!-- 代码 开始 -->
<div id="thp_notf_div" class="hpn_top_container" style="display:none;top:0px;">
	<span class="hpn_top_icon">
		<img class="rms_img" src="images/xixi.png">
	</span>
	<span class="hpn_top_desc">我们正在更新使用条款。</span>
	<a href="javascript:void(0);" class="hpn_top_link" >了解更多</a>
	<a href="#" class="hpn_top_close">我要拒绝</a>
	
</div>
<script type="text/javascript">
Cookies.defaults = {
    path: '/'
};
// 用于清除cookies的代码，调试完提示框的样式后可以删除。
// Cookies('view', undefined);
if(Cookies.get('view') === undefined) {
	$("#thp_notf_div").slideDown();
}   
$(".hpn_top_close").click(function(){
	$("#thp_notf_div").slideUp();
});
$(".hpn_top_link").click(function(){
    Cookies.set('view', 1);
	location.href = "#";
});
</script>
</body>
<style>
body{
    margin:0; padding:0;
    font-size:small;
}
</style>
</html>

JS代码(cookies.min.js):

/*! * Cookies.js - 0.4.0 * * Copyright (c) 2014,Scott Hamper * Licensed under the MIT license,* http://www.opensource.org/licenses/MIT */
!function(e){
	"use strict";
	var t=function(e,n,o){
	return 1===arguments.length?t.get(e):t.set(e,n,o)}
;
	t._document=document,t._navigator=navigator,t.defaults={
	path:"/"}
,t.get=function(e){
	return t._cachedDocumentCookie!==t._document.cookie&&t._renewCache(),t._cache[e]}
,t.set=function(n,o,r){
	return r=t._getExtendedOptions(r),r.expires=t._getExpiresDate(o===e?-1:r.expires),t._document.cookie=t._generateCookieString(n,o,r),t}
,t.expire=function(n,o){
	return t.set(n,e,o)}
,t._getExtendedOptions=function(n){
	return{
	path:n&&n.path||t.defaults.path,domain:n&&n.domain||t.defaults.domain,expires:n&&n.expires||t.defaults.expires,secure:n&&n.secure!==e?n.secure:t.defaults.secure}
}
,t._isValidDate=function(e){
	return"[object Date]"===Object.prototype.toString.call(e)&&!isNaN(e.getTime())}
,t._getExpiresDate=function(e,n){
	switch(n=n||new Date,typeof e){
	case"number":e=new Date(n.getTime()+1e3*e);
	break;
	case"string":e=new Date(e)}
if(e&&!t._isValidDate(e))throw new Error("`expires` parameter cannot be converted to a valid Date instance");
	return e}
,t._generateCookieString=function(e,t,n){
	e=e.replace(/[^#$&+\^`|]/g,encodeURIComponent),e=e.replace(/\(/g,"%28").replace(/\)/g,"%29"),t=(t+"").replace(/[^!#$&-+\--:<-\[\]-~]/g,encodeURIComponent),n=n||{
}
;
	var o=e+"="+t;
	return o+=n.path?";
	path="+n.path:"",o+=n.domain?";
	domain="+n.domain:"",o+=n.expires?";
	expires="+n.expires.toUTCString():"",o+=n.secure?";
	secure":""}
,t._getCookieObjectFromString=function(n){
	for(var o={
}
,r=n?n.split(";
	"):[],i=0;
	i<r.length;
	i++){
	var a=t._getKeyValuePairFromCookieString(r[i]);
	o[a.key]===e&&(o[a.key]=a.value)}
return o}
,t._getKeyValuePairFromCookieString=function(e){
	var t=e.indexOf("=");
	return t=0>t?e.length:t,{
	key:decodeURIComponent(e.substr(0,t)),value:decodeURIComponent(e.substr(t+1))}
}
,t._renewCache=function(){
	t._cache=t._getCookieObjectFromString(t._document.cookie),t._cachedDocumentCookie=t._document.cookie}
,t._areEnabled=function(){
	var e="cookies.js",n="1"===t.set(e,1).get(e);
	return t.expire(e),n}
,t.enabled=t._areEnabled(),"function"==typeof define&&define.amd?define(function(){
	return t}
):"undefined"!=typeof exports?("undefined"!=typeof module&&module.exports&&(exports=module.exports=t),exports.Cookies=t):window.Cookies=t}
();

CSS代码(lrtk.css):

/* ����ͼ�� �Ѽ����� www.lanrentuku.com */
#thp_notf_div{position:fixed;}
.hpn_top_container{background:none repeat scroll 0 0 #fcd116;height:3.6em;min-width:900px;position:absolute;top:-3.6em;white-space:nowrap;width:100%;z-index:2000;}
.hpn_top_icon{float:left;margin:1.1em 0 0 1.25em;}
.hpn_top_desc{color:#404040;float:left;font-size:1.2em;margin:0.94em 0 1.06em 1.25em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hpn_top_link,.hpn_top_link:visited,.hpn_top_link:hover{background:none repeat scroll 0 0 #fff;border:1px solid #ccc;color:#1020d0;margin:0.5em 0.92em 0.5em 1.84em;padding:0.62em 0.75em;}
.hpn_top_link,.hpn_top_close{cursor:pointer;display:inline-block;font-size:13px;text-align:center;vertical-align:middle;}
.hpn_top_close{color:#404040;text-decoration:underline;}
.hpn_top_link,.hpn_top_close{cursor:pointer;display:inline-block;font-size:13px;text-align:center;vertical-align:middle;}

附件:下载该文件资源,减少时间成本(增值服务)