jQuery Meetups
tạo jquery tooltips đơn giản
this.vtip = function() {
this.xOffset = -10;
this.yOffset = 22;
$(".vtip").unbind().hover(
function(e) {
this.t = this.title;
this.title = '';
this.top = (e.pageY + yOffset); this.left = (e.pageX + xOffset);
$('body').append( '<p id="vtip"><img id="vtipArrow" />' + this.t + '</p>' );
$('p#vtip #vtipArrow').attr("src", 'css/vtip_arrow.png');
$('p#vtip').css("top", this.top+"px").css("left", this.left+"px").fadeIn("slow");
},
function() {
this.title = this.t;
$("p#vtip").fadeOut("slow").remove();
}
).mousemove(
function(e) {
this.top = (e.pageY + yOffset);
this.left = (e.pageX + xOffset);
var windowwidth=document.width;
var windowheight=screen.height;
if((this.left+$('p#vtip').width())>=windowwidth-30){
leftx=this.left+$('p#vtip').width()-windowwidth;
$("p#vtip").css("top", this.top+"px").css("left", this.left-$('p#vtip').width()+15+"px");
$('#vtipArrow').css({'position' : 'absolute' , 'top': '-10px' , 'left': $('p#vtip').width()-15+'px'})
}else{
$("p#vtip").css("top", this.top+"px").css("left", this.left+"px");
}
}
);
};
jQuery(document).ready(function($){vtip();})
Views: 235
Replies to This Discussion
-
Permalink Reply by jQuery Vietnam on -
Thanks for share, nhung neu ban chuyen cai nay thanh 1 plugin thi tien loi hon, vi khi viet plugin nguoi dun`g co the selector tuy thich ma ko can chinh sua code, con hien gio cua ban fai su dung thi fai su dung selector co' dinh: .vtip, p#vtip
Mong version moi. -
© 2012 Created by jqueryadmin.
