मैं वेब पेज पर किसी विशिष्ट स्थिति के लिए लिंक कैसे बना सकता हूं? [बन्द है]


14

क्या वेब पेज पर किसी विशिष्ट स्क्रॉल स्थिति में हाइपरलिंक बनाना संभव है? उदाहरण के लिए, मैं http://www.stackoverflow.com/ का लिंक बनाना चाहूंगा , लेकिन पृष्ठ के साथ 100 पिक्सेल नीचे स्क्रॉल किया जाएगा।


काश, URL में पिक्सेल का उपयोग करके किसी विशिष्ट स्थिति से लिंक करने का एक तरीका होता।
अकिनुरी

जवाबों:


3

आप jQuery स्क्रॉलटॉ प्लगइन का उपयोग करके किसी दिए गए स्थान पर स्क्रॉल कर सकते हैं । यदि आप इसके डेमो पेज पर एक नज़र रखते हैं , तो आप देखेंगे कि प्लगइन कई अलग-अलग विकल्पों में सक्षम है, जिसमें एक निश्चित स्थिति तक स्क्रॉल करना शामिल है। इसका मतलब है कि आपको लक्ष्य के जावास्क्रिप्ट को नियंत्रित करना होगा, हालांकि, यह किसी बाहरी साइट के लिंक के लिए उपयुक्त नहीं हो सकता है।


14

इन-पेज का वैनिला रास्ता लिंक पेज में पहले से मौजूद एंकर पॉइंट के माध्यम से है ।

यह <a>…</a>टैग का उपयोग करके बनाया जा सकता है । ध्यान दें कि "लंगर बिंदु" (ऊपर) में निर्दिष्ट लिंक #h-12.2के अंत में है। यह <a id="h-12.2">12.2</a>पृष्ठ बनाने वाले HTML में एम्बेडेड से मेल खाता है , और जब क्लिक किया जाता है, तो इस एंकर को पृष्ठ दृश्य रिपोज करेगा।

ध्यान दें कि HTML5 से पहले, nameएंकर टैग में विशेषता का उपयोग किया गया था, लेकिन अब समर्थित नहीं है और idइसके स्थान ( संदर्भ ) में विशेषता का उपयोग किया जाना चाहिए । इसका मतलब यह भी है कि आप एंकर टैग के लिए किसी भी तत्व का उपयोग कर सकते हैं, आप <a>तत्व तक सीमित नहीं हैं ।


6

पॉल के उत्तर के समान, आप HTML दस्तावेज़ में टैग आईडी की पहली घटना से भी जुड़ सकते हैं। हालांकि यह पिक्सेल की सटीक संख्या नहीं होगी।

उदाहरण के लिए, इस पृष्ठ के प्रश्न या उत्तरों को लिंक / स्क्रॉल करें ।


6

पृष्ठ पर राइट-क्लिक और निरीक्षण तत्वों का प्रयास करें। आपको <a>टैग मिलेंगे , वे एंकर पॉइंट हैं।

फिर <पहले और आखिरी से पहले बाहर निकालें aताकि वे लिंक के रूप में दिखाई न दें। प्रतिक्रिया बॉक्स में लिखते समय आप वास्तव में प्रभाव देख सकते हैं, जब यह आपको नीचे पूर्वावलोकन दिखाता है।

a href="/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header">question /a>

तथा

a href="/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers">answers /a>

जैसा कि आप देख सकते हैं, एकमात्र अंतर बहुत अंत में है जहां पाउंड ( #) प्रतीक के बाद लंगर का नाम है । इसके बाद का नाम >उपयोगकर्ता के लिए लिंक कैसे पढ़ता है।

इस मामले में "प्रश्न-शीर्षलेख" को "प्रश्न" के रूप में पढ़ा जाता है और उत्तर समान होता है।

फिर माइक की टिप्पणी के लिए निम्नलिखित लिंक होना चाहिए । चूंकि उनका एंकर पॉइंट है382094

स्पष्ट करने के लिए, आप बस लंगर ढूंढ सकते हैं और #अपने लिंक के बाद जोड़ सकते हैं।

/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header

/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers

/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#880079

ये सभी आपको एक ही पृष्ठ पर विभिन्न स्थानों पर ले जाएंगे।


क्या यह केवल आईडी के लिए काम करता है या यह कक्षा के लिए भी काम करता है? उदाहरण के लिए, यदि मेरे पास एक तत्व है, तो कहें, <h3 class = "theClass"> हैडर </ h3>, मैं इस तत्व से कैसे लिंक कर सकता हूं जिसमें आईडी विशेषता मान नहीं है?
यूलिसिस अल्व्स

1

किसी पृष्ठ पर एक पिक्सेल विशिष्ट स्थिति से लिंक करने के लिए, एंकर टैग को एक div के अंदर रखें जो "टॉप: x लेफ्ट: y" निर्देशांक का उपयोग करके पूरी तरह से स्थित है।


मैंने इसका उपयोग एक उत्तरदायी साइट बनाने में किया जहां मेनू शीर्ष के साथ तय किया गया था। सामान्य लक्ष्यों ने मेनू के पीछे स्थित अनुभाग के शीर्ष को रखा। इसके ऊपर की तकनीक का उपयोग करके मेनू के नीचे के साथ आवश्यक वर्गों के शीर्ष को बनाना आसान था।
ग्रीम

0

यदि आप उस स्थिति में आईडी का उपयोग नहीं करते हैं तो भी आप किसी वेबपेज की विशिष्ट स्थिति से लिंक करने के लिए Citebite का उपयोग कर सकते हैं । यह प्रयोग करने में आसान है। बस मैं यहां दिए गए लिंक पर जाऊं और फिर अपने टेक्स्ट पेज को टेक्स्ट टेक्स्ट फील्ड में जाने के बाद सबसे पहले दिखाना चाहता हूं और फिर सोर्स यूआरएल टेक्स्ट फील्ड में वेबपेज का लिंक उपलब्ध कराएं। इसके बाद Make Citebite पर क्लिक करें। फिर यह एक लिंक उत्पन्न करेगा। वह लिंक आपका वांछित लिंक होगा।


1
सुपर उपयोगकर्ता में आपका स्वागत है! कृपया पढ़ें कैसे सॉफ्टवेयर की सिफारिश करने के लिए न्यूनतम आवश्यक जानकारी कैसे सूपर उपयोगकर्ता पर सॉफ्टवेयर की सिफारिश करने पर और सुझावों। आपके उत्तर को उपयोगी रखने के लिए भले ही प्रदान की गई लिंक इन विवरणों को आपके उत्तर में संपादित कर दें।
मैं कहता हूं कि मोनिका से

@Twisty प्रदान की गई लिंक सॉफ्टवेयर है। यह एक वेब ऐप है। यह पर्याप्त लगता है। हालाँकि, फाराबी, यदि आपका Citebite से कोई संबंध है, तो आपको इसका खुलासा करना होगा। अन्यथा, आप अच्छे हैं।
डंकन एक्स सिम्पसन

@DuncanXSimpson कृपया मेरे द्वारा लिंक की गई मेटा पोस्ट पढ़ें। साइट मानकों को पूरा करने के लिए केवल सॉफ्टवेयर के नाम और लिंक की आवश्यकता होती है।
मैं कहता हूं कि मोनिका से

@ तिवारी 1. किया। 5. ठीक है, मुझे लगता है कि आप यहाँ एक मामला बना सकते हैं। फैराबी, आपको इसका उपयोग करने के तरीके पर एक संक्षिप्त निर्देश देना चाहिए। 6. व्यक्तिगत कुछ भी नहीं है। यह उपकरण वही है जो ओपी को चाहिए था; न आधिक न कम।
डंकन एक्स सिम्पसन

1
लिंक मर चुका है :(
आर्यन फिरोजियन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.