मोडलबॉक्स - डायलॉग बॉक्स बनाएं

Modalbox डायलॉग बॉक्स और विज़ार्ड बनाने के लिए प्रोटोटाइप और script.aculo.us पर एक पुस्तकालय है, इसका कोड वॉल्यूम केवल 10kb है। मेरी राय में यह वेब दो नग की एक वास्तविक विशेषता है।





Modalbox IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 और 9 में काम करता है।



यह वही है जो मॉडेलबॉक्स के साथ बनाई गई विज़ार्ड विंडो जैसा दिखता है:

स्थापना

1. ModalBox डाउनलोड करें और इसे फ़ोल्डर में अनज़िप करें, उदाहरण के लिए / इसमें (आपके पास पहले से प्रोटोटाइप + script.aculo.us लाइब्रेरी होनी चाहिए, क्योंकि उन्हें काम करने के लिए Modalbox की आवश्यकता है।)
2. हेड टैग के बीच नीचे कोड डालकर सभी आवश्यक लाइब्रेरी कनेक्ट करें:
   
   

     <script type = "text / javascript" src = "में / prototyp.js"> </ script> शामिल है
    <script type = "text / javascript" src = "में / scriptaculous.js शामिल हैं? text
        लोड = प्रभाव "> </ script>
    <script type = "text / javascript" src = "में / modalbox.js"> </ script शामिल है 

   
   
   
3. सीएसएस डिजाइन फ़ाइल से कनेक्ट करें - "modalbox.css", सिर के टैग के बीच कोड भी डालें:
   
   

     <लिंक rel = "स्टाइलशीट" href = "में / modalbox.css" प्रकार = "टेक्स्ट / css" शामिल है
    मीडिया = "स्क्रीन" /> 

   
   
   

उदाहरण का उपयोग करें

  <a href = "frame_send-link.html" शीर्षक = "सरल रूप" onclick = "
 <strong> Modalbox.show (यह.href, {शीर्षक: this.title, width: 600});  गलत लौटें; </ strong>
 "> एक दोस्त को लिंक भेजें </a> 

यह उदाहरण पृष्ठ को फिर से लोड किए बिना 600px चौड़े मोडलबॉक्स के रूप में फ्रेम_सेंड-लिंक.html पेज खोलेगा।

ModalBox लाइब्रेरी डाउनलोड करें



लाइव उदाहरणों का एक समूह देखें

स्रोत: "चेरनेव। आरयू" - सकारात्मक ब्लॉग