जावास्क्रिप्ट के साथ सीएसएस परिवर्तन चर
जावास्क्रिप्ट के साथ चर बदलें
CSS वेरिएबल्स की DOM तक पहुंच है, जिसका अर्थ है कि आप उन्हें जावास्क्रिप्ट के साथ बदल सकते हैं।
यहां एक उदाहरण दिया गया है कि आप पिछले पृष्ठों में उपयोग किए गए उदाहरण से --blue चर को प्रदर्शित करने और बदलने के लिए एक स्क्रिप्ट कैसे बना सकते हैं। अभी के लिए, यदि आप जावास्क्रिप्ट से परिचित नहीं हैं तो चिंता न करें। आप हमारे जावास्क्रिप्ट ट्यूटोरियल में जावास्क्रिप्ट के बारे में अधिक जान सकते हैं :
उदाहरण
<script>
// Get the root element
var r = document.querySelector(':root');
// Create a function for getting a variable value
function
myFunction_get() {
// Get the styles (properties and values) for the
root
var rs = getComputedStyle(r);
// Alert the value of
the --blue variable
alert("The value of --blue is: " +
rs.getPropertyValue('--blue'));
}
// Create a function for setting a
variable value
function myFunction_set() {
// Set the value of
variable --blue to another value (in this case "lightblue")
r.style.setProperty('--blue', 'lightblue');
}
</script>
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो
var()फ़ंक्शन का पूर्ण समर्थन करता है।
| Function | |||||
|---|---|---|---|---|---|
| var() | 49.0 | 15.0 | 31.0 | 9.1 | 36.0 |
सीएसएस वर () समारोह
| Property | Description |
|---|---|
| var() | Inserts the value of a CSS variable |