लाइटबॉक्स आपकी वेबसाइट के चित्रों और वीडियो को प्रदर्शित करने के लिए एक जावास्क्रिप्ट फाइल है। जब आप ग्राफिक के रिलेशनशिप एट्रिब्यूट के लिए "लाइटबॉक्स" मान देते हैं, तो उपयोगकर्ता ग्राफिक को स्क्रीन पर विस्तारित करने के लिए क्लिक कर सकते हैं। उदाहरण के लिए, यदि आपकी कंपनी होम अंदरूनी डिज़ाइन करती है और आपकी साइट में आपके काम के नमूने शामिल हैं, तो लाइटबॉक्स तत्व ग्राहकों को आपके पोर्टफोलियो के माध्यम से अलग-अलग वेब पेज खोले बिना ब्राउज़ कर सकते हैं। ब्राउज़र डिफ़ॉल्ट रूप से लाइटबॉक्स तत्वों को केंद्र में रखते हैं, लेकिन आप इस लेआउट को काउंटर करने वाले कोड को ब्लॉक करने के लिए Dreamweaver में अतिरिक्त कदम उठा सकते हैं।

1।

Dreamweaver Files पैनल को खोलने के लिए "F8" दबाएं।

2।

इसे खोलने के लिए "lightbox.css" पर डबल-क्लिक करें।

3।

"लाइटबॉक्स" शैली को परिभाषित करने वाले ब्लॉक पर स्क्रॉल करें। इस ब्लॉक का कोड निम्न के जैसा होगा:

प्रकाश बॉक्स {

स्थिति: निरपेक्ष; चौड़ाई: 100%; z- इंडेक्स: 10000; पाठ-संरेखण: केंद्र; लाइन-ऊँचाई: 0; फ़ॉन्ट-परिवार: "ल्यूसिडा ग्रांडे", ताओमा, वर्दाना, एरियल, सैंस-सेरिफ़; फ़ॉन्ट-वजन: सामान्य; }

4।

यदि वे पहले से मौजूद नहीं हैं, तो ब्लॉक के भीतर निम्नलिखित लाइनें जोड़ें:

बायां: 0; शीर्ष: 0;

5।

निम्न पंक्ति के साथ शैली की "स्थिति" विशेषता को सेट करने वाली लाइन को बदलें:

स्थिति: निश्चित;

6।

फ़ाइल सहेजें।