js学习小笔记
1.$.cookie('history_back', backurl, { expires: 7, path: '/' }):创建一个key为"history_back",value为backurl,过期时间为7天,生效路径为根路径的cookie。
实现网页的消息推送效果:
<DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body{ margin:0; } .pop{ width:400px; height:300px; background-color:#fff; border:1px solid #ccc; position:fixed; left:50%; top:50%; margin-left:-200px; margin-top:-250px; z-index:9999; opacity:0; filter:alpha(opacity=0); } .pop span{ float:right; font-size:30px; cursor:pointer; } .mask{ width:100%; height: 100%; background-color:#000; opacity:0.6; filter:alpha(opacity=60); position:fixed; z-index:9990; left:0; top:0 } .pop_con{ display:none; } .hasknow{ text-align:center; cursor:pointer; margin-top:100px; } </style> <script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="../js/jquery.cookie.js"></script> <script type="text/javascript"> $(function(){ var read = $.cookie('hasread'); //alert(read); if(read==undefined) { $('.pop_con').show(); $('.pop').animate({marginTop:-150,opacity:1}); } $('.hasknow').click(function() { $.cookie('hasread','ok',{expires:7,path:'/'}); $('.pop_con').hide(); }); }) </script> </head> <body> <div class="pop_con"> <div class="pop"> <span>×</span> <p>我们网站有优惠,赶紧行动吧!亲!</p> <p class="hasknow">我知道了</p> </div> <div class="mask"></div> </div> <h1>网站首页</h1> </body> </html>
2.Animate.css 一款强大的预设css3动画库:http://www.jq22.com/jquery-info819