私は自分のサイトに実装したいと思っていますが、stackoverflow.comのように表示されているdivブロックが表示されています。既成のソリューションがすでに用意されている可能性がありますか?私はJavascriptで詩ではなく、助けに非常に感謝しています!JavaScriptとCookieを使ってブロックを隠す(覚えておいてください)?
6
A
答えて
3
これは、任意の外部ライブラリを使用せずに簡単な実施例です。あなたはあなたのアニメーション/デザインでそれを改善することができます。また、これらのクッキー機能は非常に簡単ですが、将来ブール値だけでなく設定することもできます。 更新:私はあなたのポップアップを再び表示するためにfunctonを追加しました(ほとんどの場合デバッグ用です)。
<html>
<head>
<script type="text/javascript">
function setCookie (name, value, expires, path, domain, secure) {
document.cookie = name + "=" + escape(value) +
((expires) ? "; expires=" + expires : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "");
}
function getCookie (name) {
var cookie = " " + document.cookie;
var search = " " + name + "=";
var setStr = null;
var offset = 0;
var end = 0;
if (cookie.length > 0) {
offset = cookie.indexOf(search);
if (offset != -1) {
offset += search.length;
end = cookie.indexOf(";", offset);
if (end == -1) {
end = cookie.length;
}
setStr = unescape(cookie.substring(offset, end));
}
}
if (setStr == 'false') {
setStr = false;
}
if (setStr == 'true') {
setStr = true;
}
if (setStr == 'null') {
setStr = null;
}
return(setStr);
}
function hidePopup() {
setCookie('popup_state', false);
document.getElementById('popup').style.display = 'none';
}
function showPopup() {
setCookie('popup_state', null);
document.getElementById('popup').style.display = 'block';
}
function checkPopup() {
if (getCookie('popup_state') == null) { // if popup was not closed
document.getElementById('popup').style.display = 'block';
}
}
</script>
</head>
<body onload="checkPopup();">
<div id="popup" style="display:none">Hello! Welcome to my site. If you want to hide this message then click <a href="#" onclick="hidePopup(); return false;">[x]</a></div>
<div>Some static text here.</div>
<div>Bring me <a href="#" onclick="showPopup(); return false;">back</a> my popup!</div>
</body>
</html>
0
オルタナティブ:
-> Using localStorage instead of cookie<br/>
-> LocalStorage never expire until they delete personal data on browser<br/>
-> jQuery Library for easy customization on future<br>
-> re-display hidden remembered content<br>
-> jsfiddle.net/axcelleria/41t76s8q/<br>
ああ、私はあなたがあまりにもモバイル検出を必要と覚えていますか..?ここでは編集は次のとおりです。
モバイル検出のために:
jsfiddle.net/axcelleria/nmosxbgm/
関連する問題
- 1. 登録時に覚えておいてください
- 2. Flex:SuperTabNavigatorのPopUpButtonのタブインデックスと名前を覚えておいてください。
- 3. Railsのwill_paginateで働く価値を覚えておいてください
- 4. カラムの幅、位置、および表示されていることを覚えておいてください。
- 5. リスト内のラジオボタンの選択状態を覚えておいてください
- 6. ログイン前の前のルートを覚えておいてください。Cakephp 3
- 7. (覚えておいてください)Awk/SED/Echoを使用してCSVの列エントリを削除する
- 8. 何も思い出せずに覚えていることを覚えてください
- 9. symfony forceログインして私を覚えてください
- 10. passport.js:私がエクスプレスアプリでは動作しないことを覚えておいてください
- 11. jQueryクッキーを使用してメニュー位置を覚えてください
- 12. 「私を覚えています」チェックボックスを追加してください
- 13. 提出されていないフォームデータを覚えておくには?
- 14. jQueryで私を覚えてください
- 15. 次のページのためにスラッグを覚えてください
- 16. Firebase Unityゲームの認証を覚えてください
- 17. TensorFlow:前のエポックの重みを覚えてください
- 18. ドロップダウンを覚えておく文書クッキー
- 19. ドラッグ可能にする方法をネイティブで覚えておいてください
- 20. ループでOpenCVを使って以前の画像を覚えておくには?
- 21. ドロップダウンメニューの最後の状態を覚えておくためのJquery Cookie
- 22. 次のページで同じdivを開き、jQueryまたはJavaScriptを使用して覚えておいてください
- 23. Firebugを使って、どのJavaScriptが起動されているか教えてください。
- 24. cookieまたはlocalStorageを使用してdivのオープン/クローズ状態を覚えておく方法は?
- 25. javascriptを使って幅を適用すると、CSSをトランジションする方法を教えてください。
- 26. もっと良いjavascriptのテキストマッチングスコアリングシステムをお探しください
- 27. ローカルドメインのCookieがIE/Edgeによってブロックされている
- 28. "start function"と "parameters"を使ってjavascriptファイルを呼び出してください
- 29. fullcalendarユーザオプションを覚えています。 Cookieの月/週/日
- 30. スパーク(糸を使って)を使ってすべてのノードを使う方法を教えてください。
インク、BIGおかげで私の質問への答えのために!私はあなたの助けに非常に感謝しています。申し訳ありませんがすぐに答えられませんでした。 – user1103744
あなたは大歓迎です:) – ink