Title prompt tooltip for custom a tag in html

Introduction to the title prompt tooltip of tag a in custom html
Create a custom a tag title prompt with simple jquery + CSS to replace the default browser behavior.



Javascript code

</pre><pre name="code" class="javascript">$(function() {       $("a[title]").each(function() {        var a = $(this);        var title = a.attr('title');        if (title == undefined || title == "") return;        a.data('title', title)            .removeAttr('title')            .hover(                function () {                    var offset = a.offset();                    $("<div id=\"anchortitlecontainer\"></div>").appendTo($("body")).html(title).css({ top: offset.top + a.outerHeight() + 10, left: offset.left + a.outerWidth() + 1 }).fadeIn(function () {                        var pop = $(this);                        setTimeout(function () { pop.remove(); }, pop.text().length*80);                    });                },                function() { $("#anchortitlecontainer").remove(); }            );    });});

Don't forget to reference JQuery.
SetTimeout (function () {pop. remove () ;}, pop. text (). length * 80) is calculated based on the length of the title, used to prevent too short title prompt too long or too long title prompt too short.
CSS code

#anchortitlecontainer {    position: absolute;    z-index: 5999;    border: solid 1px #315B6C;    padding: 5px;    color: #315B6C;    background: none repeat scroll 0 0 #FFFFFF;    border-radius: 5px;    display: none;}#anchortitlecontainer:before {    position: absolute;    bottom: auto;    left: -1px;    top: -15px;    border-color: transparent transparent transparent #315B6C;    border-style: solid;    border-width: 15px;    content: "";    display: block;    width: 0;}#anchortitlecontainer:after {    position: absolute;    bottom: auto;    left: 0px;    top: -13px;    border-color: transparent transparent transparent #FFFFFF;    border-style: solid;    border-width: 15px;    content: "";    display: block;    width: 0;}

Use some CSS3 features to avoid using images.

I am not a CSS guru. It takes some time to bring up this style. If someone can use it, it would be my pleasure. :)