Open In App

jQuery Mobile vmouseover Event

Last Updated : 23 Dec, 2020
Comments
Improve
Suggest changes
Like Article
Like
Report

jQuery Mobile vmouseover event is fired when we hover the mouse over an element. We can use this event for our different purposes.

Syntax:

jQuery( ".selector" ).on( "vmouseover", function( event ) {  } )

Approach: First, add jQuery Mobile scripts needed for your project.

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"/> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

Example 1:

HTML
<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" href=
"http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />

    <script src=
        "http://code.jquery.com/jquery-1.11.1.min.js">
    </script>

    <script src=
"http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
    </script>

    <script type="text/javascript">
        $(document).on('vmouseover', 'a',
            function (event) {
                console.log(event);
            });
    </script>
</head>

<body>
    <center>
        <h1>GeeksforGeeks</h1>
        <h4>
            Mouseover Event using
            jQuery Mobile
        </h4>
    </center>
    <a data-role="button" 
        id="gfg">click</a>
</body>

</html>

Output:

Example 2:

HTML
<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" href=
"http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />

    <script src=
        "http://code.jquery.com/jquery-1.11.1.min.js">
    </script>

    <script src=
"http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
    </script>

    <script type="text/javascript">
        $(document).on('vmouseover', 'a',
            function () {
                console.log('mouseover event');
            });
    </script>
</head>

<body>
    <center>
        <h1>GeeksforGeeks</h1>
        <h4>
            Mouseover Event using
            jQuery Mobile
        </h4>
    </center>

    <a data-role="button" id="gfg">click</a>
</body>

</html>

Output:


Article Tags :

Similar Reads