保持一個DIV關閉一段時間

我有這個標記與我保持一個DIV關閉一段時間

<div id="message"> 
    <h2>Some Heading</h2> 
    <span> 
      <img src="" alt="close"></img> 
    </span> 
</div>

當我點擊圖像時，DIV消失

$("#message").click(function() { 
     $(this).fadeOut("slow"); 
});

但是，當我刷新頁面，它再次出現。現在我發現jquery-cookie插件是確保DIV不再出現的方式，但我無法通過此示例進行連接。

我基本上想設置cookie來隱藏7天的div。當有人訪問該頁面7天后，再次顯示div。

任何想法？

這裏有一個小提琴http://jsfiddle.net/8gaGm/1/

來源

2014-05-07 user3279259

jQuery的cookie的插件不需要這個。要更改到期時間限制，請將86400000*7更改爲任何您想要的值。這是以毫秒爲單位的時間（86400000是一天7次）。

將display:none;添加到#message CSS。

的Javascript：

var cookies = document.cookie; 

if(cookies.search('hideMessage=1') === -1){ 
    $("#message").show(); 
} 

$("#message").click(function() { 
    $(this).fadeOut("slow"); 
    document.cookie = 'hideMessage=1; expires='+(new Date(Date.now()+(86400000*7)).toUTCString()); 
});

DEMO

來源

2014-05-07 02:16:15

輝煌亞當。我會喜歡一個免費的插件方法。 – user3279259

@ user3279259沒問題！ –

只有一個跟進問題。只要Cookie存放在用戶的機器上，如果我必須永遠關閉它，該怎麼辦？ – user3279259

使用的cookies，如果您的瀏覽器需要允許它，使用HTML5本地存儲來存儲你可以用它來做出wheather或不顯示的決定日期的替代DIV。

鏈接： http://diveintohtml5.info/storage.html

來源

2014-05-07 02:06:46 TGH

不錯的建議，但脂肪酶可以不使用被HTML5的瀏覽器，所以我堅持cookie的選項 – user3279259

嘗試

我用https://github.com/carhartl/jquery-cookie jQuery的cookie的插件

這是一個有些想法，集$.cookie('the_cookie', 'the_value', { expires: 7 });時的onclick div和對文檔加載檢查如果cookie設置或不。

E.g

$(function() { 
    // check cookie set or not, if set hide div else show div 
    if($.cookie('message_cookie') != 'undefined') { 
    $("#message").hide(); 
    } else { 
    $("#message").show(); 
    } 

    $("#message").click(function() { 
    $(this).fadeOut("slow"); 
    //set a cookie 
    $.cookie('message_cookie', '1', { expires: 7 }); 
    }); 
});

來源

2014-05-07 02:16:31

謝謝泰米爾語。你的代碼有效。 – user3279259

保持一個DIV關閉一段時間

回答

相關問題