JavaScript से इमेज की चमक और कंट्रास्ट कैसे सेट करें?

उदाहरण

CSS filter प्रॉपर्टी से brightness() और contrast() फंक्शन का उपयोग करें।

<!DOCTYPE html>
<html>
  <body>
    <p>इमेज की चमक और कंट्रास्ट बदलने के लिए नीचे क्लिक करें।</p>
    <button onclick="display()">इमेज संपादित करें</button><br><br>
    <img id="myID" src="https://www.tutorialspoint.com/videotutorials/images/tutorial_library_home.jpg" alt="ट्यूटोरियल लाइब्रेरी" width="320" height="320">
    <script>
      function display() {
        document.getElementById("myID").style.filter = "brightness(50%) contrast(50%)";
      }
    </script>
  </body>
</html>

सुधार: मूल कोड में दो बार filter सेट किया गया था, जिससे पहला ओवरराइट हो जाता। सही तरीका: एक ही filter में दोनों फंक्शन जोड़ें।

अन्य फिल्टर: grayscale(), sepia(), blur(), saturate(), hue-rotate(), invert(), opacity()।