jQuery+cookie仿苏宁每天首页出现广告弹出层

jQuery+cookie仿苏宁每天首页出现广告弹出层

添加时间:2021-03-15 04:54:33
站长推荐丨赞助论坛,可获取海量资源终身免费下载权限奥!
举报 举报
收藏
预览
附件 附件
  • 模板类型模板类型:弹窗
  • 模板颜色模板颜色:中级
  • 下载积分下载积分:28 米粒
  • 下载权限下载权限:

    赞助会员

在项目中经常遇到首页每天出现弹出层广告,一般我们用PHP或cookie插件https://jy.tp.yuanmeng.life/js/89.html来设置时间。今天站长用简单的cookie函数来做一个这样的基于jQuery的广告DEMO。
jQuery+cookie仿苏宁每天首页出现广告弹出层
分类:悬浮层/弹出层 > 弹窗 难易:中级

弹出层图片、关闭按钮.new_close以及苏宁网页ifrmae

<div class="new_user"  id="new_user">
    <div class="new_pic">
        <a target="_blank" href="http://sucaihuo.com">
            <img alt="智慧小屋大背景图片" src="images/pic.png">
        </a>
    </div>
    <span class="new_close" onclick="hideNewUser()"></span>
</div>
<div class="overlay" id="overlay"></div>
<iframe src="https://jy.tp.yuanmeng.life/modals/4/444/demo/" width="100%" height="100%" scrolling="yes"/>

jQuery+cookie设置每天弹出一次广告,关闭后不再显示

var is_first = getCookie("is_first");
if (is_first != 1) {
    showNewUser();
    var time = getTodayOtherTime(); //每天一次
    setCookie("is_first", 1, time);//3600 * 24 有效期一天
} else {
    hideNewUser();
}

//设置cookies函数

function setCookie(name, value, time) { //name:cookie键名,value:cookie键值,和时间S
    var exp = new Date();
    exp.setTime(exp.getTime() + time * 1000);//有效期1小时 
    document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
}

//从当前时间到明日0点的时间戳

function getTodayOtherTime() {
    var today = new Date();
    today.setHours(0);
    today.setMinutes(0);
    today.setSeconds(0);
    today.setMilliseconds(0);
    //明日0点时间戳
    var tomorrow_0 = today.getTime() / 1000 + (24 * 3600);
    var current_time = Math.round(new Date().getTime() / 1000);
    var expire = tomorrow_0 - current_time;
    return expire;
}

显示广告

function showNewUser() {
    var document_height = $(document).height();
    var window_height = $(window).height();
    var height = document_height > window_height ? document_height : window_height;
    $("#overlay").css({"height": height, "display": "block"})
    $("#new_user").show();
}

隐藏广告并关闭背景遮罩层

function hideNewUser() {
    $("#new_user").hide();
    $("#overlay").css({"display": "none"})
}
相关内容推荐
资源求助发帖
查看更多发帖

*

回帖描述:

*

链接类型:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
热点内容推荐
标题:jQuery+cookie仿苏宁每天首页出现广告弹出层

*

描述:
平均回复时间:3-10分钟
规则介绍:悬赏寻求论坛网友分享资源,站点对分享内容的准确性,合法性,版权等没有足够的监管能力。如果您发现资源不正确,无法使用,不符合法律法律等情况,您可以直接举报资源。站长将尽快核实您的举报,并根据情况,采取封号,退换米粒等处理。

*

回帖描述:

*

链接类型:

*

阅读权限:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
  • 背景波浪
  • 背景波浪
  • 波浪
  • 波浪
客服
在线咨询
周一 至 周日 9:00 ~ 22:00
QQ:1326974360
微信:juyoubuluo6688
客服热线
18205485173
工作日 9:00 ~ 18:00
微信扫码咨询
客户服务
欢迎咨询服务
咨询量较多时,请耐心等待
社群

关注公众号

获取更多资讯

扫码进群(QQ)

与更多大牛交流沟通

0.093694s