Jquery implements the idea and code of popping up a prompt box when the mouse is moved up and disappearing when the mouse is moved_jquery

Ideas:

1. First, locate the elements to achieve this effect. This time, use class

2. If you want to dynamically display different prompt content, you need to set the title

3. Add mouseover and mouseout events to the positioned element through JQ

4. Improve it again, and the pop-up box will follow the mouse to move on the target element

5. Then Merge mouseover and mouseout into hover

Copy code The code is as follows:

//The page is loaded
$(function () {
var x = 10;
var y = 20; //Set the prompt box relative to the offset position to prevent the mouse from being blocked
$(".prompt"). hover(function (e) { //Mouse up event
this.myTitle = this.title; //Assign the title to the custom attribute myTilte and block the built-in prompt
this.title = "";
var tooltipHtml = "

" this.myTitle "

"; //Create a prompt box
var tooltipHtml = "

" / /Add to page
            $("#tooltip").css({                       "top": (e.pageY y) "px",             "left": (e.pageX x) " px"
}).show("fast"); //Set the coordinates of the prompt box and display
}, function () { //Mouse out event
this.title = this.myTitle; //Reset the title
                                                                                                                                                                               "#toolti").css({ "top": (e.pageY y) "px",
"left": (e.pageX x) "px"
  });
}) ;
});

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn