कैसे उपयोग करने के लिए डोम करने के लिए पृष्ठभूमि में परिवर्तन-आकार के साथ रेडियो बटन (जावास्क्रिप्ट)

Question 1

मैं पूछना चाहता हूँ अगर वहाँ है एक विकल्प यह करने के लिए दृष्टिकोण. मैं बहुत नया हूँ करने के लिए जावास्क्रिप्ट

मैं 3 रेडियो बटन बदल जाएगा कि पृष्ठभूमि आकार के साथ एक DIV. मैं प्रबंधित करने के लिए यह संभव बनाने के लिए का उपयोग करके त्रिगुट में जो यह परिवर्तन पृष्ठभूमि आकार, तो इसकी जाँच की । DOM. जाहिरा तौर पर कवर नहीं करता है काम करते हैं. मैं परीक्षण किया है कई बार, लेकिन केवल ऑटो और होते हैं काम करता है जब रेडियो की जाँच की है. वहाँ है कोई डिफ़ॉल्ट पृष्ठभूमि आकार के मूल्य में सीएसएस. ऐसा लगता है जैसे अपने डिफ़ॉल्ट ऑटो है, हालांकि कवर नहीं काम करता है जब की जाँच की है, जबकि को शामिल करता है. धन्यवाद :डी यहाँ कोड है ।

                <div class="radiobtn">

                <input type="radio" id="bgCOVER" name="radiobtnnm" value="COVER" onclick="backgroundfunc()">
                <label for="BGcover">Background Cover</label> 

                    <input type="radio" id="bgAUTO" name="radiobtnnm" value="AUTO" onclick="backgroundfunc()">
                <label for="BGauto">Background Auto</label> 

                    <input type="radio" id="bgCONTAIN" name="radiobtnnm" value="CONTAIN" onclick="backgroundfunc()">
                <label for="BGcontain">Background Contain</label> 
            </div>

जावास्क्रिप्ट:

function backgroundfunc() {
var coverval = document.getElementById("bgCOVER");
document.getElementById("outputjs").style.webkitBackgroundSize = coverval.checked ? "cover" : "none";

var autoval = document.getElementById("bgAUTO");
document.getElementById("outputjs").style.backgroundSize = autoval.checked ? "auto" : "auto";

var containval = document.getElementById("bgCONTAIN");
document.getElementById("outputjs").style.backgroundSize = containval.checked ? "contain" : "none";

}

मैं एक समाधान मिला

css dom html javascript

2021-11-24 03:54:54

Question 2

शायद यह मदद मिलेगी आप:

var coverval = document.getElementById("BGcover");
var containval = document.getElementById("BGcontain");
var autoval = document.getElementById("BGauto");
      
function backgroundfunc(){
      document.querySelector("body").style.backgroundSize = coverval.checked ? "cover" : "none";
      
      document.querySelector("body").style.backgroundSize = autoval.checked ? "auto" : "auto";
      
      document.querySelector("body").style.backgroundSize = containval.checked ? "contain" : "none";
}

body{
background:url('https://cdn.mos.cms.futurecdn.net/ntFmJUZ8tw3ULD3tkBaAtf.jpg');
background-size:auto;
}

<html>
<head>
</head>
<body>
  <div class="radiobtn">
    <input type="radio" id="BGcover" name="radiobtnnm" value="COVER" onclick="backgroundfunc()">
    <label for="BGcover">Background Cover</label>
    <input type="radio" id="BGauto" name="radiobtnnm" value="AUTO" onclick="backgroundfunc()">
    <label for="BGauto">Background Auto</label>
    <input type="radio" id="BGcontain" name="radiobtnnm" value="CONTAIN" onclick="backgroundfunc()">
    <label for="BGcontain">Background Contain</label>
  </div>
</body>
</html>

Shivam Sharma · Answer 1 · 2021-11-25T08:41:22

शायद यह मदद मिलेगी आप:

var coverval = document.getElementById("BGcover");
var containval = document.getElementById("BGcontain");
var autoval = document.getElementById("BGauto");
      
function backgroundfunc(){
      document.querySelector("body").style.backgroundSize = coverval.checked ? "cover" : "none";
      
      document.querySelector("body").style.backgroundSize = autoval.checked ? "auto" : "auto";
      
      document.querySelector("body").style.backgroundSize = containval.checked ? "contain" : "none";
}

body{
background:url('https://cdn.mos.cms.futurecdn.net/ntFmJUZ8tw3ULD3tkBaAtf.jpg');
background-size:auto;
}

<html>
<head>
</head>
<body>
  <div class="radiobtn">
    <input type="radio" id="BGcover" name="radiobtnnm" value="COVER" onclick="backgroundfunc()">
    <label for="BGcover">Background Cover</label>
    <input type="radio" id="BGauto" name="radiobtnnm" value="AUTO" onclick="backgroundfunc()">
    <label for="BGauto">Background Auto</label>
    <input type="radio" id="BGcontain" name="radiobtnnm" value="CONTAIN" onclick="backgroundfunc()">
    <label for="BGcontain">Background Contain</label>
  </div>
</body>
</html>

कैसे उपयोग करने के लिए डोम करने के लिए पृष्ठभूमि में परिवर्तन-आकार के साथ रेडियो बटन (जावास्क्रिप्ट)

सवाल

सबसे अच्छा जवाब

अन्य भाषाओं में

यह पृष्ठ अन्य भाषाओं में है

इस श्रेणी में लोकप्रिय

लोकप्रिय सवाल इस श्रेणी में