给博客加上来源弹窗

不知道标题能描述清楚不,不过看下效果图就大体知道了:

弹窗效果是用的jDialog,判断首次访问弹出该层,主要就是判断document.referrer,下面贴部分代码,由于代码我都集成到模板上去了:

//来源弹窗
function setCookie(name,value)
{
    var Days = 30;
    var exp  = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString()+";path=/";
}
function changeLocal(el) {
 var referrer = document.referrer;
 var source,keyregx,keyq;
 if (referrer.indexOf("google.com") > 0) {
    keyregx = new RegExp("q=(.*?)&","g");
    keyq = keyregx.exec(referrer);
    source = '<p>欢迎通过Google搜索来到本博客的朋友,你搜索的内容是<font color=red>'+decodeURI(keyq[1])+'</font>。</p>';
 } 
  else if (referrer.indexOf("bing.com") > 0) 
  {
    keyregx = new RegExp("q=(.*?)&","g");
    keyq = keyregx.exec(referrer);
    source = '<p>欢迎通过Bing搜索来到本博客的朋友,你搜索的内容是<font color=red>'+decodeURI(keyq[1])+'</font>。</p>';
 }
  else
  {
  source = "<p>欢迎通过其他途径来到本博客的朋友。</p>";
 }
 $(el).jDialog({
  ...
 return false
}
if (document.cookie.indexOf('FirstVisit=') < 0){
 changeLocal("#header");
  setCookie("FirstVisit", 'no');
}

代码可以查看源码就不多说了,有问题留言,我会继续补充。

由于Chrome和Firefox以及IE的cookie机制不一样,所以更新了下代码,主要是Firefox下允许Name不同Path的cookie,而Chrome下不会。

转载请注明: 本文《给博客加上来源弹窗》来源于bstaint的博客

没有评论:

发表评论