javascript - Hide div permanently until next visit -


मेरे पास वर्ग " पूर्णस्क्रीन " के साथ निम्नलिखित div है

  & Lt; div वर्ग = "फ़ुलस्क्रीन" & gt; & Lt; / div & gt; 

उस div के अंदर, एक बटन है जो एक बार क्लिक किया जाता है, यह किसी अन्य डिवा में नीचे स्क्रॉल करेगा जिसमें " #page " की एक आईडी है।

प्रश्न है, मैं " फ़िरस्क्रीन " वर्ग के साथ " #page " पर स्क्रॉल करने के साथ कैसे नियमित रूप से div को छुपाता हूं और बस गए? यह तब तक बिल्कुल नहीं दिखाना है जब तक कि वेबसाइट का फिर से दौरा न किया जाए, भले ही पृष्ठ से दूर किया जाए और उसके पास वापस आ गया हो।

कृपया यहां लाइव उदाहरण ढूंढें, क्योंकि यह स्पष्ट होगा सब कुछ:

बटन का HTML कोड: & lt; a href = "# हेडर" & gt; खोजें & lt; / a & gt;

< पी> जेएस:

  // चिकना स्क्रॉल $ ('ए')। क्लिक करें (फ़ंक्शन () {$ ('html, body')। चेतन ({scrollTop: $ ($ ( यह) .attr ('href')) .ऑफ़सेट ()। शीर्ष}, 1500); वापसी वापस;});  

अंतिम अपडेट: मैंने यह बताया है कि कुकीज़, स्थानीय स्टोरेज, या नीचे सर्वर-साइड सत्रों वाला मान। इस प्रकार मैं इन समाधानों को आपके पोस्ट कोड के साथ लागू करूँगा:

  // चिकना स्क्रॉल $ ('ए')। क्लिक करें (फ़ंक्शन () {$ ('html, body')। ({Scrollopop: $ ($ (यह) .attr ('href')) .ऑफ़सेट ()। शीर्ष}, 1500); / * हमने एनिमेटेड किया है, इसे फिर से कभी नहीं करने के लिए चर सेट करें / / (support_storage )) स्थानीयस्टॉरेज ['नॉफ़लस्क्रीन'] = सच; वापसी झूठी;});  

ऊपर, हम अपने लोकल स्टोरेज वैरिएबल सेट कर रहे हैं (मैंने इसे 'नोफुलस्क्रीन' नाम दिया है, जो कि आप को जो भी समझ में आता है, उसे बदलने के लिए स्वतंत्र है), इसलिए हम जानते हैं कि उपयोगकर्ता ने देखा है पहले से ही हमारे पूर्णस्क्रीन अब, जब पृष्ठ लोड होता है, तो हम वैरिएबल की जांच करना चाहते हैं, और इसके अनुसार कार्य करना चाहते हैं:

  $ (document) .ready (function () {if (localstorage ['nofullscreen'] == 'सच') $ ('। पूर्णस्क्रीन')। Hide ();});  

यह पृष्ठ लोड पर वर्ग "फुलस्क्रीन" के साथ डिवि को छुपा देना चाहिए, अगर भंडारण चर मौजूद है और 'सत्य' है।


आप उपयोगकर्ता मशीन पर कुकी को संग्रहीत करना चाहते हैं ताकि वे अतीत में देख सकें। आप ऐसा मूल जावास्क्रिप्ट के साथ ऐसा कर सकते हैं, जैसे:

  document.cookie = "nofullscreen = true";  

उपर्युक्त रेखा स्थानीय भंडारण में एक कुकी बनायेगी, जब आप # पृष्ठ पर स्क्रॉल कर लें तो इसे चलाएं।

  फ़ंक्शन doFullscreen () {var नाम = "नफ़लस्क्रीन ="; Var कुकीज़ = document.cookies.split (';'); Cookies.forEach (function (n) {var c = cookies [i] .trim (); अगर (c.indexOf (name) == 0) return c.substring (name.length, c.length);} वापसी झूठी ;});  

उपर्युक्त पृष्ठ पृष्ठ लोड पर चला सकते हैं, यह सच हो जाएगा कि उपयोगकर्ता पहले यहां आया है और आपको # पृष्ठ पर सही होना चाहिए, या गलत होगा यदि इसका नया उपयोगकर्ता और आपको करना चाहिए फ़ुलस्क्रीन डिवाईस प्रदर्शित करें।

अद्यतन: दूसरों ने स्थानीय स्टोरेज का उपयोग करने का सुझाव दिया है, यह भी एक अच्छा विचार है यहाँ का एक छोटा उदाहरण है।

संगतता के लिए जांच रहा है:

  फ़ंक्शन का समर्थन करता है (स्टोरेज) {{विंडो में & amp; खिड़की ['स्थानीयस्टॉरेज']! == नल; } पकड़ (ई) {वापसी झूठी; }}  

भंडारण में लेखन:

  यदि (support_storage ()) localStorage ['sitename.nofullscreen'] = सच;  

भंडारण की जांच:

  अगर (स्थानीयस्टॉरेज ['sitename.nofullscreen'] == "सच") {// #page पर जाने के लिए सही}  

अपडेट # 2: PHP सत्र संग्रह आपने टिप्पणियों में समझाया है कि आपके द्वारा PHP का भी उपयोग करना है मुझे लगता है कि उपरोक्त समाधानों में से कोई भी ठीक ही काम करेगा, लेकिन मैं पूर्णता के लिए कुछ PHP कोड जोड़ूंगा।

सबसे पहले, आपको सत्र शुरू करना होगा:

  & lt;? Php session_start ()? & Gt;  

अब आप सत्र के साथ PHP के साथ लिख सकते हैं:

  & lt; php $ _SESSION ['nofullscreen'] = 'सही' ; ? & Gt;  

और जांचें कि क्या सत्र वैरिएबल बाद में सेट किया गया है:

  & lt;? Php if ($ _ session ['nofullscreen'] == 'true' ) {// छप सीएसएस के नियमों को छिपाने के लिए यहाँ #उपुलस्क्रीन? }? & Gt;  

यदि आपको सत्र चर को साफ़ करने की आवश्यकता है, तो आप अनसेट का उपयोग कर सकते हैं:

  & lt; php unset ($ _ session ['nofullscreen'])? & gt;  

आशा है कि यह मदद करता है!


Comments