jquery simulates title prompt effect-PHP Tutorial-php.cn

jquery simulates title prompt effect

小云云

Release： 2023-03-17 15:42:01

Original

1618 people have browsed it

jQuery is a cross-browser JavaScript library that simplifies operations between HTML and JavaScript. The first version was released by John Resig at BarCamp NYC in January 2006. It is currently being developed by a development team led by Dave Methvin. 59% of the world's top 10,000 most visited websites use jQuery, which is currently the most popular JavaScript library.

In this article we mainly introduce the effect of jquery simulating title prompts. Did we know that When the length of text characters is limited, some long titles will always be truncated. Using title prompts is simple but simple It will cause redundancy in the page html code. Here, jquery is used to create a simulated title prompt effect. The specific code is as follows:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery实现的简单文字提示效果</title>
<script src="http://www.phpernote.com/js/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
#pt_phpernote{
position:absolute;
border:1px solid #333;
background:#f7f5d1;
padding:2px;
color:#333;
display:none;
font-size:12px;
}
</style>
<script type="text/javascript">
$(function(){
    var x=10,y=20;
    $("a.pt").mouseover(function(e){
        $("body").append("<div id=&#39;pt_phpernote&#39;>"+ this.text+"<\/div>");
        $("#pt_phpernote").css({"top":(e.pageY+y)+"px","left":(e.pageX+x)+"px"}).show("fast");
    }).mouseout(function(){
        $("#pt_phpernote").remove();
    }).mousemove(function(e){
        $("#pt_phpernote").css({"top":(e.pageY+y)+"px","left":(e.pageX+x)+"px"});
    });
})
</script>
</head>
<body>
<p><a href="#" class="pt">php cli下接受参数的几种方法</a></p>
</body>
</html>

Copy after login

The above is the entire content of jquery's simulated title prompt effect. I hope it will be useful to everyone. help.

Related recommendations:

What is the difference between JS and JQUERY

How to use jQuery to achieve the magnifying glass effect

How to set up scheduled refresh in jquery

jQuery effect implementation

jQuery selector example sharing about attribute filter selector

The above is the detailed content of jquery simulates title prompt effect. For more information, please follow other related articles on the PHP Chinese website!