Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

जावास्क्रिप्ट के साथ रंग मीटर के लिए #CCCCCC और #3B5998 के बीच रंग उत्पन्न करें?

<घंटा/>

हमें एक फ़ंक्शन लिखना है जो दो दिए गए रंगों के बीच एक यादृच्छिक रंग उत्पन्न करता है। आइए इस समस्या को भागों में बांटें -

  • पहला → हम एक फ़ंक्शन लिखते हैं जो दो दी गई संख्याओं के बीच एक यादृच्छिक संख्या उत्पन्न करता है।

  • दूसरा → यादृच्छिक रंग निर्माण के लिए हेक्स स्केल का उपयोग करने के बजाय, हम हेक्स को 0 से 15 दशमलव पैमाने पर मैप करेंगे और इसके बजाय इसका उपयोग करेंगे।

  • अंत में → हम दिए गए किसी भी रंग के तार पर लूप करते हैं और एक यादृच्छिक रंग उत्पन्न करते हैं।

उदाहरण

const randomBetween = (a, b) => {
   const max = Math.max(a, b);
   const min = Math.min(a, b);
   return Math.floor(Math.random() * (max - min) + min);
};
const randomColor = (firstColor, secondColor) => {
   first = firstColor.toUpperCase().substring(1, secondColor.length);
   second = secondColor.toUpperCase().substring(1, firstColor.length);
   const scale = '0123456789ABCDEF';
   let color = '#';
   for(let i = 0; i < first.length && i < second.length; i++ ){
      const random = randomBetween(scale.indexOf(first[i]),
      scale.indexOf(second[i]));
      color += scale[random];
   };
   return color;
};
console.log(randomColor('#34324a', '#42342c'));
console.log(randomColor('#f43250', '#12342c'));
console.log(randomColor('#34324a', '#47942c'));
console.log(randomColor('#ffffff', '#000000'));

कंसोल में संभावित आउटपुट निम्नलिखित है -

नोट - यह कई संभावित आउटपुट में से एक है क्योंकि आउटपुट हर बार रैंडम होता है।

आउटपुट

#33332A
#C23328
#36822B
#35102A

  1. सीएसएस और जावास्क्रिप्ट के साथ पसंद/नापसंद बटन के बीच कैसे टॉगल करें? सीएसएस और जावास्क्रिप्ट के साथ पसंद/नापसंद बटन के बीच कैसे टॉगल करें?

    CSS और JavaScript के साथ पसंद/नापसंद बटन के बीच टॉगल करने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/> <style>  

  1. रंग के यादृच्छिक हेक्स कोड उत्पन्न करने के लिए जावास्क्रिप्ट रंग के यादृच्छिक हेक्स कोड उत्पन्न करने के लिए जावास्क्रिप्ट

    जावास्क्रिप्ट का उपयोग करके रंग के यादृच्छिक हेक्स कोड उत्पन्न करने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0&qu

  1. जावास्क्रिप्ट में यादृच्छिक रंग जनरेटर जावास्क्रिप्ट में यादृच्छिक रंग जनरेटर

    जावास्क्रिप्ट में यादृच्छिक रंग उत्पन्न करने के लिए सिंटैक्स निम्नलिखित है - $("#yourIdName").css("background-color", yourCustomFunctionNameToGetRandomColor()); निम्नलिखित जावास्क्रिप्ट कोड है - उदाहरण <!DOCTYPE html> <html lang="en"> <head> <meta