poshytip is a jquery-based plug-in mainly used to display Weibo people's images and mouse prompts_jquery

This effect often has two requirements

1 When the mouse moves over the person image, the person's information is displayed, and when the mouse leaves the person image, the person's related information is hidden
2 When the mouse moves When reaching the person's information block, the information is still displayed. When the mouse leaves the person's information block, the information is hidden
3 It must be automatically closed instead of manually closed

Usually the first one is easier to satisfy, but The first one is more troublesome to handle when events bubble up.
At this time, it is difficult to handle the second demand.
When building a Weibo APP, it is often necessary to display people’s For personal information, I think I should get the js from Sina or Tencent. I have been working on it for a long time but I can’t find the js.
None of the tooltips recommended in the blog park can meet the three requirements.

After searching for a long time, I found a working one on the Internet,

Address: http://demo.jb51.net/js/2011/poshytip/demo/index.html
Download addresshttp://www.jb51.net/jiaoben/38747.html
However, in order to reduce server pressure, this js will create a lot of divs when used intensively, so I optimized it a little bit ,
The code is as follows

Copy code The code is as follows:

$.Poshytip = function( elm, options) {
if( $(elm).data('Poshytipkeyint')!="1")
{
$(elm).data('Poshytipkeyint','1')
}
else
{
return;
}
this.$elm = $(elm);
this.opts = $.extend({}, $.fn .poshytip.defaults, options);

this.$tip = $(['

',
'

',
'

',
'

'].join('')).appendTo(document.body);

this.$arrow = this.$tip.find('div.tip-arrow');
this.$inner = this.$tip.find('div.tip-inner');
this.disabled = false;
this.content = null;
this.init();
};