उस गेज के उच्च मान को निर्दिष्ट करने के लिए एक गेज के साथ HTML उच्च विशेषता का उपयोग किया जाता है। बेहतर परिणाम प्राप्त करने के लिए गेज की अधिकतम, न्यूनतम, निम्न विशेषताओं के साथ इसका उपयोग करें।
आइए मीटर ऊंचाई . का एक उदाहरण देखें संपत्ति -
उदाहरण
<!DOCTYPE html> <html> <head> <title>Meter high</title> <style> form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } </style> </head> <body> <form> <fieldset> <legend>Meter-high</legend> <label for="paulaLifeSource">Paula's Health Risk: </label> <meter id="paulaLifeSource" max="100" min="0" high="80" low="70" value="85"></meter> <input type="button" onclick="lifeSource()" value="Medi Kit"> <div id="divDisplay"></div> </fieldset> </form> <script> var divDisplay = document.getElementById("divDisplay"); divDisplay.textContent = 'Life Source at '+paulaLifeSource.value; function lifeSource(effect){ var paulaLifeSource = document.getElementById("paulaLifeSource"); var Immunity = paulaLifeSource.high; paulaLifeSource.high = 90; divDisplay.textContent = 'Immunity increased to '+paulaLifeSource.high+' from '+Immunity; } </script> </body> </html>
यह निम्नलिखित आउटपुट देगा -
1) 'मेडी किट' clicking क्लिक करने से पहले बटन -
2) 'मेडी किट' पर क्लिक करने के बाद बटन -