When the cursor moves over some elements, a cue box like tips pops up.
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title>jquery Dynamic prompt message box effect </title><base target= "_blank"/>
<style type= "Text/css" >
* {Font-family:monaco;}
div.item_keleyi_com {width:100px; height:50px; background-color:maroon; text-align:center; padding-top:25px;}
div#item_keleyi_com_1 {position:absolute; top:50px; left:50px;color:white;}
div#item_keleyi_com_2 {position:absolute; top:500px; left:0px;color:white;}
div#item_keleyi_com_3 {position:absolute; top:0px; left:500px;color:white;}
div#item_keleyi_com_4 {position:absolute; top:500px; left:500px; color:white;}
ul{list-style:none;padding:0px 0px 0px 10px;} A{color:blue;}
</style>
<link rel= "stylesheet" href= "http://keleyi.com/keleyi/phtml/jqtexiao/2/stylesheets/jquery.tooltip/ Jquery.tooltip.css "type=" Text/css "/>
<script type= "Text/javascript" src= "Http://keleyi.com/keleyi/pmedia/jquery/jquery-1.10.2.min.js" ></ Script>
<script type= "Text/javascript" src= "Http://keleyi.com/keleyi/phtml/jqtexiao/2/javascripts/jquery.tooltip.js" ></script>
<script type= "Text/javascript" >
$j = Jquery.noconflict ();
$j (document). Ready (function () {
$j ("Div.item_kel" + "eyi_com"). ToolTip ();
});
</script>
<body>
<div id= "item_keleyi_com_1" class= "item_keleyi_com" >
Collayi
<div class= "tooltip_description" style= "Display:none" title= "Collayi Details" >
Name of this website: Collayi <br/>
URL of this website: keleyi.com <br/>
This site provides jquery special effects, JavaScript instances, ASP. NET source and other content information, Welcome to visit! Collayi
<br/> Tool: http://tool.keleyi.com
<br/> Search Site content: http://so.keleyi.com
</div>
</div>
<div id= "item_keleyi_com_2" class= "item_keleyi_com" >
Jquery
<div class= "tooltip_description" style= "Display:none" title= "jquery Introduction" >
URL: http://keleyi.com/menu/jquery/
<br/> Collayi Online has many jquery effects and knowledge, welcome to visit.
jquery implementation script and page separation <br/>
Save developer Learning Time <br/>
Let JavaScript programming become interesting <br/><br/><br/>
For more information, please visit: http://so.keleyi.com/<br/>
Search: jquery's strengths and weaknesses
</div>
</div>
<div id= "Item_keleyi_com_3" class= "item_keleyi_com" >
HTML5
<div class= "tooltip_description" style= "Display:none" title= "Introduction to HTML5" >
HTML5 the development of more and more mature, many applications have gradually appeared in your daily life, not only to the traditional website of the interactive Flash gradually replaced by HTML5 technology, more importantly, through the HTML5 technology to develop Cross-platform mobile phone software, so many developers feel very excited! <br/>
Generally speaking, the HTML5 contains HTML, CSS and JavaScript three parts, not just the HTML part, CSS 3 and JavaScript also have a lot of innovation, so that the entire Web page program features more fun. <br/>
Keleyi.com
</div>
</div>
<div id= "Item_keleyi_com_4" class= "item_keleyi_com" >
Javascript
<div class= "tooltip_description" style= "Display:none" title= "JavaScript Introduction" >
In JavaScript, the scope of a variable has global (Window object) scope and function call scope. <br/>
JS Gets the local extranet/WAN IP address <br/><br/><br/>
For more information, please visit: http://so.keleyi.com/<br/>
Searching: JavaScript scopes <br/>
JS Gets the local extranet/WAN IP address <br/>
</div>
</div>
<div style= "clear:both;margin-top:130px;width:960px;" >
<p> please move the cursor over four rectangles. Applicable browsers: IE8, 360, FireFox, Chrome, Safari, Opera, Proud tour, Sogou, the window of the world. <br/> Source: <a href= "http://keleyi.com/" > Collayi </a> <a href= "http://keleyi.com/a/bjac/hxv86dyi.htm" > Original </a></p>
<ul>
<li><a href= "http://keleyi.com/a/bjac/kjsrt3b0.htm" >jquery ajax</a></li>
<li><a href= "http://keleyi.com/a/bjac/182di68b.htm" > Navigation styles </a></li>
<li><a href= "http://keleyi.com/a/bjac/mt97p5y9.htm" > Side navigation </a></li>
<li><a href= "http://keleyi.com/dev/3068696139522ae4.htm" > Tree-shaped Menu </a></li>
<li><a href= "http://keleyi.com/a/bjac/ck9atu5j.htm" >jquery UI collapsible Accordion Menu </a></li><li> <a href= "http://keleyi.com/a/bjac/r55i6646.htm" >jquery:even even selector </a></li><li><a "Http://keleyi.com/a/bjac/9rf4gedp.htm" > expand, put up Div's jquery code </a></li><li><a href= "http:// Keleyi.com/a/bjac/mnmpm4bv.htm ">jquery Picture merry-go example </a></li>
</ul>
</div>
</body>
