HTML में एक पॉप-अप विंडो बनाना jQuery लाइब्रेरी का उपयोग करके किया जाता है, जो आपको एक ईवेंट हैंडलर को वेब पेज में एकीकृत करने की अनुमति देता है और इस तरह साइट की सक्रिय सामग्री को प्रदर्शित करना संभव बनाता है।
निर्देश
चरण 1
अपना HTML साइट पृष्ठ उस टेक्स्ट एडिटर में खोलें जिसका उपयोग आप अपने इच्छित कोड को लिखने के लिए करते हैं। आप पॉप-अप विंडो डालने के लिए मानक विंडोज नोटपैड उपयोगिता का भी उपयोग कर सकते हैं। ऐसा करने के लिए, HTML फ़ाइल पर राइट-क्लिक करें और "ओपन विथ" - "नोटपैड" चुनें।
चरण 2
दस्तावेज़ अनुभाग में, एक परत बनाएं जो jQuery को संभाल ले:
चरण 3
फिर आपको पॉपअप विंडो का नाम सेट करना होगा। ऐसा करने के लिए, आप टियर किए गए HTML हेडर का उपयोग कर सकते हैं:
विंडो शीर्षक
चरण 4
उसके बाद, पैराग्राफ बनाने के लिए स्क्रिप्ट का उपयोग करके विंडो में प्रदर्शित होने वाले टेक्स्ट को सेट करें:
मूलपाठ
चरण 5
फिर पिछले हैंडल को बंद करने से पहले, पॉपअप को बंद करने के लिए क्लास क्लोज़_विन के साथ एक लेयर बनाएं:
एक विंडो बंद करें
चरण 6
दस्तावेज़ वर्णनकर्ताओं के बीच आवश्यक टैग जोड़कर फ़ाइल में jQuery लाइब्रेरी शामिल करें। उदाहरण के लिए:
चरण 7
उसके बाद, पॉपअप प्रदर्शित करने के लिए कोड दर्ज करें:
$ (फ़ंक्शन () {
$ ('# दिखाएँ')। छिपाएँ ();
चरण 8
इसके बाद, आपको उस घटना को संभालने की आवश्यकता है जिसे उपयोगकर्ता ने पॉप-अप विंडो को आमंत्रित करने और विंडो के समापन को संभालने के लिए माउस बटन दबाया। ऐसा करने के लिए, निम्न कोड दर्ज करें:
$ ('# क्लिक-मी')। क्लिक करें (फ़ंक्शन () {$ ('# शो')। फ़ेडिन (300);})
$ ('# Close_win')। क्लिक करें (फ़ंक्शन () {$ ('# शो')। FadeOut (300);})
और लेफ्टिनेंट / स्क्रिप्ट>})
यह प्रोग्राम पॉप-अप विंडो को कॉल करने के लिए बटन दबाने और इसे बंद करने के लिए लिंक पर क्लिक करने वाले उपयोगकर्ता को संभालता है।
चरण 9
पृष्ठ पर पॉप-अप विंडो प्रदर्शित करने के लिए, आप ऊपर दिए गए कोड में निर्दिष्ट क्लिक-मी वर्ग के लिंक का उपयोग कर सकते हैं। ऐसा करने के लिए, दस्तावेज़ के मुख्य भाग में निम्न कोड दर्ज करें:
पॉपअप दिखाने के लिए क्लिक करें
