वेबसाइट में डायनामिकली बैकग्राउंड कैसे बदलें

CSS और जावास्क्रिप्ट का उपयोग करके, आप अपनी वेबसाइट पर पृष्ठभूमि को गतिशील रूप से बदल सकते हैं। जब आप उपयोगकर्ता किसी वेबसाइट को ब्राउज़र में लोड करते हैं, तो आप पृष्ठभूमि को बदलने के लिए कोड का उपयोग करते हैं, और यदि उपयोगकर्ता ब्राउज़र विंडो में वेबसाइट को ताज़ा करता है तो कोड भी काम करता है। आपके पास आपके सर्वर पर अपलोड की गई पृष्ठभूमि में उपयोग की गई छवियां होनी चाहिए, इसलिए वे ब्राउज़र में ठीक से प्रदर्शित होती हैं।

1।

उस HTML पृष्ठ पर राइट-क्लिक करें जिसे आप संपादित करना चाहते हैं और "ओपन विथ" चुनें। कार्यक्रमों की सूची में अपने HTML संपादक पर क्लिक करें।

2।

प्रत्येक छवि को एक जावास्क्रिप्ट सरणी में लोड करें। उदाहरण के लिए, निम्न कोड वेब होस्ट सर्वर पर दो छवियों की एक सरणी बनाता है:

var पृष्ठभूमि = नया ऐरे (); पृष्ठभूमि [0] = "/images/bg1.gif"; पृष्ठभूमि [1] = "/images/bg2.gif";

3।

एक यादृच्छिक संख्या उत्पन्न करें। यादृच्छिक से एक छवि को सरणी से यादृच्छिक रूप से प्राप्त करने के लिए यादृच्छिक संख्या का उपयोग किया जाता है। इस उदाहरण में, दो चित्र लोड किए गए हैं, इसलिए आपको 0 और 1. के बीच एक संख्या उत्पन्न करनी चाहिए। निम्नलिखित कोड एक यादृच्छिक संख्या उत्पन्न करता है:

var numberGen = Math.floor (Math.random () * 1)

4।

सरणी से पृष्ठभूमि छवि प्रदर्शित करें। निम्नलिखित कोड छवियों की सरणी और वेबसाइट की पृष्ठभूमि के रूप में एक यादृच्छिक छवि प्रदर्शित करने के लिए यादृच्छिक संख्या को जोड़ती है:

document.body.style.background = 'यूआरएल (' + पृष्ठभूमि [numberGen] ')';

लोकप्रिय पोस्ट