3

だから私はこのスクリプトを持っています(ゼロに達したときに'#fb-popupdiv' divを閉じるカウントダウンタイマー):

var dom = {};
dom.query = jQuery.noConflict(true);
var time = 11;
window.setInterval(test, 1000);
function test()
{
    time -=1;
    dom.query('#my_timer').html(time); 
    if(time == 0)        
    {
        dom.query('#fb-popupdiv').remove();
    }
} 

これと組み合わせる方法はありますか?:

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
   else var expires = "";
   document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
       if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);

    }
    return null;
}

function eraseCookie(name) {
    createCookie(name,"",-1);
}​

説明させてください。likeboxポップアップdivを作成しています。私のサイトにアクセスするユーザーには、そのポップアップを1日に1回だけ表示してもらいたいのです(したがって、何度も何度も私のサイトにアクセスすることはありません)。だから私はそれを達成するために両方のスクリプトを組み合わせる方法を考えようとしています。

これは私がこれまでに持っているものです:

HTML:

<div id="fb-popupdiv">
<div id="fb-popup">
<h1 class="fb-title">To continue, click "Like" button</h1>
<p style="background:#fff;padding-bottom:20px;">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FBlindGuardianArgentina&amp;width=457&amp;height=263&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color=%23fff&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:457px; height:263px;" allowTransparency="true"></iframe>
<span class="fb-closebutton">Or wait <span id="my_timer"></span> seconds.</span>
</p>
</div>
</div>

CSS:

#popupdiv{position:absolute;display:none;}
#fb-popupdiv{display:block;top:180px;left:278.5px;width:500px;height:355px;position:fixed;background-image:url('http://i.imgur.com/IHT1l.png');margin:0;overflow-y:auto;z-index:999999;text-align:center;border:10px solid rgba(82, 82, 82, .7);border-radius:8px;}
#fb-popup{background-color:#fff;overflow:none;z-index:999999;height:227px;}
.fb-title{background:#6D84B4 none repeat scroll 0 0;border-top:1px solid #3B5998;border-left:1px solid #3B5998;border-right:1px solid #3B5998;color:white !important;padding:5px !important;margin:0 !important;font:normal 14px "Lucida Sans Unicode", "Lucida Grande", sans-serif !important;}
.fb-closebutton{float:right;font:normal 11px/2.5em Arial, sans-serif !important;padding:5px 15px 20px 0;background:#fff;width:97%;text-align:right;color:#000 !important;}
#my-timer{width:400px;background:#fff; margin:0 auto;padding:5px 0px 5px 0px;}

それは可能ですか、それとも私はそれをすべて間違っていますか?

初心者です、ごめんなさい。

前もって感謝します!

PS:すみません、私の英語が下手です。

4

3 に答える 3

1

jquery.cookieプラグインを検討しましたか?

if (!$.cookie('daily_popup')) {
    // Code to show modal/popup; e.g. show_modal();
    $.cookie('daily_popup', 1, {expires: 1});
}
于 2012-12-14T17:58:23.797 に答える
1

プラグインを参照してください:

https://github.com/carhartl/jquery-cookie

その後、次のことができます。

$.cookie("test", 1);

削除するには:

$.cookie("test", null);

さらに、Cookieに特定の日数(ここでは10日)のタイムアウトを設定するには、次のようにします。

$.cookie("test", 1, { expires : 10 });

有効期限オプションを省略すると、CookieはセッションCookieになり、ブラウザが終了すると削除されます。

すべてのオプションをカバーするには:

$.cookie("test", 1, {
   expires : 10,           //expires in 10 days

   path    : '/',          //The value of the path attribute of the cookie 
                           //(default: path of page that created the cookie).

   domain  : 'jquery.com',  //The value of the domain attribute of the cookie
                           //(default: domain of page that created the cookie).

   secure  : true          //If set to true the secure attribute of the cookie
                           //will be set and the cookie transmission will
                           //require a secure protocol (defaults to false).
});
于 2012-12-14T18:00:47.510 に答える
1

1日に1回だけ何かを表示するために、Cookieコードをどのように使用するかについてもっと質問しているようです。そのための基本的なロジックは次のとおりです。

これをCSSに入れて、ポップアップがデフォルトで表示されないようにします。

#fb-popupdiv {display: none;}

次に、次のJavaScriptを追加します。

dom.query(document).ready(function() {
    var val = readCookie("popupAlreadyShown");
    if (!val) {
        createCookie("popupAlreadyShown", 1, 1);
        // use your code here to show the popup here
        dom.query("#fb-popupdiv").show();
    } else {
        // popup was already shown less than 1 day ago
        // because cookie still exists
        // do anything else you might want to do here
    }
});
于 2012-12-14T18:07:47.777 に答える