html - Default :target with CSS -
मेरे पास यह सीएसएस है:
& lt; style type = "text / css" & gt ; .tab {display: none; } .tab: लक्ष्य {प्रदर्शन: ब्लॉक; } & Lt; / style & gt;
और यह HTML:
& lt; div class = "tab_container" & gt; & Lt; ul class = "tabs" & gt; & Lt; li & gt; & lt; a href = "# अपडेट-सूची" & gt; सूची & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "# अपडेट-मैप" & gt; मानचित्र & lt; / a & gt; & lt; / li & gt; & Lt; / ul & gt; & Lt; ul class = "टैब सूची" id = "अपडेट-सूची" & gt; हे .. नमस्ते! & Lt; / ul & gt; & Lt; div वर्ग = "टैब मैप" id = "अपडेट-मैप" & gt; & lt; / div & gt; & Lt; / div & gt;
हालांकि, यदि कोई लक्ष्य (URL में #
) निर्दिष्ट नहीं है और कोई भी टैब अभी तक क्लिक नहीं किया गया है, तो मेरा पृष्ठ रिक्त है मैं डिफ़ॉल्ट रूप से ul # update-list
दिखाना चाहता हूं।
मैं यह कैसे कर सकता हूं? धन्यवाद।
अपडेट: इसके आगे, मेरा Google मानचित्र तोड़ा गया है यदि यह प्रारंभिक लक्ष्य नहीं है। क्या किसी को कोई फिक्स पता है?
सहज रूप से मुझे यह कहना होगा कि मैं सोच सकता हूँ दुर्भाग्य से जावास्क्रिप्ट का उपयोग कर रहा है ऐसा कुछ:
& lt; script type = "text / javascript" & gt; If (document.location.hash == ""; document.location.hash == "#") document.location.hash = "# update-list"; & Lt; / स्क्रिप्ट & gt;
संपादित करें:
ठीक है, एक सीएसएस समाधान मिला हालांकि इसके लिए अंतिम प्रविष्टि # update-list
की आवश्यकता है (पिछले # updates-map
और आप जो भी जोड़ सकते हैं, उसके बाद):
.tab, .tab: target ~ # update-list {display: none; } # अपडेट-सूची, .tab: लक्ष्य {डिस्प्ले: ब्लॉक; }
Comments
Post a Comment