Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to realize mouse over display and leave hiding by jquery

2025-04-01 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

This article mainly introduces jquery how to achieve mouse display, away from the hidden relevant knowledge, the content is detailed and easy to understand, simple and fast operation, with a certain reference value, I believe that after reading this jquery how to achieve mouse display, leave the hidden article will have a harvest, let's take a look.

Methods: 1, use the hover () method to bind the mouse event to the parent element, and specify two event handlers, syntax "parent element .hover (passing through the function, leaving the function)"; second, in the passing function, display the child element with "child element .show ()"; and (3) hide the child element with "child element .hide ()" in the departure function.

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

Jquery realizes the mouse over display, leaving the hidden effect.

Implementation method:

Use the hover () method to bind a mouse event to the parent element and specify two event handlers-- through the display function and away from the hidden function

In the pass-through function, use show () to display child elements

In the leave function, use hide () to hide child elements

Implementation example:

Div {border: 1px solid red; height: 100px;} p {background-color: pink; display: none } $(function () {$("div") .hover (function () {$("p") .show ()) }, function () {$("p") .hide ();})

P element, hidden by default, displayed when the mouse is over and hidden when leaving

Use the mouse to hover over div elements

Description:

The hover () method specifies two functions to run when the mouse pointer hovers over the selected element.

Method triggers mouseenter and mouseleave events.

Note: if you specify only one function, both mouseenter and mouseleave execute it.

Syntax:

The $(selector) .hover (inFunction,outFunction) parameter is required to describe inFunction. Specifies the function to run when the mouseenter event occurs. OutFunction is optional. Specifies the function to run when the mouseleave event occurs. This is the end of the article on "how to display the mouse over jquery and leave it hidden". Thank you for reading! I believe that everyone has a certain understanding of the knowledge of "how to achieve mouse display and leave hiding" in jquery. If you want to learn more knowledge, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report