针对网页弹窗功能开发处理的简单方法

1.后端代码获得后台设置的弹窗是否开启,如果开启设置cookie

 if(config('tc_status')==1){
            $isclose='yes';
            cookie('isClose',$isclose);
        }

2.前端利用jquery.cookie.js 来读取cookie来控制前端弹窗界面的显示与隐藏

js部分相关代码

function closetc(){
$("#noter_box").hide();
}

document.getElementById("close_btn").onclick=function() {
            document.getElementById("noter_box").style.display='none';
            return false;
        }

        if($.cookie("isClose") != 'yes'){
            $.cookie("isClose",'yes',{ expires:1});
            document.getElementById("noter_box").style.display='block';
        }

HTML相关代码

<div class="noter_info">
<img src="/newstyle/img/tc_03_01.png" alt="">
<div class="noter_text">
<p>罗网vip活动进行中!感谢大家支持!</p>
<img style="height: 100%; position: absolute; top: 0; left: 0; z-index: -1;" src="/newstyle/img/tc_03_02.png" alt="">
</div>
<div style="width: 100%; text-align: center; margin-top: 15px;">
<img id="close_btn" onclick="if (!window.__cfRLUnblockHandlers) return false; closetc()" style="display: inline-block;width: 30px;" src="/newstyle/img/tc_07.png" alt="">
</div>
</div>
</div>
<script charset="utf-8" src="/newstyle/js/jquery.cookie.js"></script>

 

小提示:如遇到加密压缩包,默认解压密码为: luowangziyuanfenxiang 如遇到无法解压的请联系管理员!
免责声明:
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的。
不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。
本站信息来自网络收集整理,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。
如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件与我们联系处理。敬请谅解!

罗网 » 针对网页弹窗功能开发处理的简单方法