jQuery :image Selector

Last Updated : 10 Jul, 2023

The jQuery :image selector is used to select the input elements with a type equal to the image.

Syntax:

$(":image")

Parameter: :enabled selector: It is used for selecting HTML input elements for changing its properties, e.g. background-color, etc.

Example 1:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>:image Selector</title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script>
        $(document).ready(function () {
            $(":image").css("height", "50px");
        });
    </script>
</head>
 
<body>
    <center>
        <form action="#">
            <h1>Welcome to GeeksforGeeks!</h1>
            Image
            <input type="image" src="logo.png"
                   width="31" height="30">
        </form>
    </center>
</body>
 
</html>

Output: It changes the height of the image:

Example 2:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>:image Selector</title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script>
        $(document).ready(function () {
            $(":image").css("width", "150px");
        });
    </script>
</head>
 
<body>
    <center>
        <div style="background-color: #ffff94;">
            <h1>Welcome to GeeksforGeeks!.</h1>
            Image
            <input type="image" src="logo.png"
                   width="31" height="30">
        </div>
    </center>
</body>
 
</html>