Open In App
Related Articles

HTML | DOM input image height Property

Improve Article
Improve
Save Article
Save
Like Article
Like

The Input Image Height in HTML DOM is used to sets or returns the value of the height Attribute the <input type=”image”>

Syntax: 

  • It returns the height Property.
imageObject.height
  • It sets the height Property.
imageObject.height = value;

Property Value: It contains the numeric value which specifies the height of the image in terms of pixels. 

Return Value: It returns a numeric value which represents the height of the image. 

Example: This Example returns the Input Image height Property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
        HTML DOM Input Image height Property
    </title>
</head>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
    <h2>
          DOM Input Image height Property
      </h2>
    <button onclick="my_geek()">
        <input id="myImage"
               type="image"
               src=
               alt="Submit"
               formaction="#"
               formtarget="#"
               formenctype="text/plain"
               width="48"
               height="48">
    </button>
    <h2 id="Geek_h"
        style="color:green;">
    </h2>
    <script>
        function my_geek() {
 
            // Return height of Input Image field
            var txt = document.getElementById(
                "myImage").height;
            document.getElementById(
                "Geek_h").innerHTML = txt;
        }
    </script>
</body>
</html>


Output: 

Before Clicking On Button:

  

After Clicking On Button:

  

Example-2: This Example sets the Input Image height Property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
        HTML DOM Input Image height Property
    </title>
</head>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
    <h2>DOM Input Image height Property</h2>
    <button onclick="my_geek()">
        <input id="myImage"
               type="image"
               src=
               alt="Submit"
               formaction="#"
               formtarget="#"
               formenctype="text/plain"
               width="48"
               height="48">
    </button>
    <h2 id="Geek_h"
        style="color:green;">
    </h2>
    <script>
        function my_geek() {
 
            // change height of Input Image field
            var txt = document.getElementById(
                "myImage").height = 96;
            document.getElementById(
                "Geek_h").innerHTML = txt;
        }
    </script>
</body>
</html>


Output: 

Before Clicking On Button:

  

After Clicking On Button:

  

Supported Browsers: The browsers supported by DOM input image height Property are listed below:

  • Google Chrome
  • Edge 12+
  • Firefox
  • Apple Safari
  • Opera

Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out - check it out now!

Last Updated : 26 Aug, 2022
Like Article
Save Article
Previous
Next
Similar Reads
Complete Tutorials