/*
* Tooltip script
* powered by 淅淅码雨
*
* written by Wany
*
*
*/
this.tooltip = function(){
var xOffset = 10;// Define the offset of x
var yOffset = 20; //Define the offset of y
$("img").mousemove(function(e){
var positionX=e.originalEvent.x -$(this).offset().left||e.originalEvent.layerX-$(this).offset().left||0;//Get the x coordinate of the current mouse relative to img
var positionY=e .originalEvent.y-$(this).offset().top||e.originalEvent.layerY-$(this).offset().top||0;//Get the y coordinate of the current mouse relative to img, (below If not needed, you can delete it)
var tipTitle;//Define the tip title
if(positionX<=$(this).width()/2)//When the current relative x coordinate of the mouse is less than half the width of the picture Execute
{
$('p').remove();//Remove the p tag
$('a').attr('href','http
//www. google.cn');//Modify the href attribute of the a tag to change the link
tipTitle='Google';
}
else
{
$('p').remove( );
$('a').attr('href','http
//www.baidu.com');
tipTitle='Baidu';
}
$ ("body").append("
" tipTitle "
");//Add this p tag to the body tag to implement the prompt function
$(" #tooltip").css("top",(e.pageY - xOffset) "px")//Set css style for the element with id tooltip
.css("left",(e.pageX yOffset) " px")
.fadeIn("fast");//Add animation effect
},
function(){
$("#tooltip").remove();//Mouse movement Remove the tooltip when the tooltip is removed, so that the relative position of the tip and the mouse remains unchanged
});
$("img").mouseout(function(e){
$("#tooltip").remove( );//The tooltip will no longer be displayed when the mouse moves out of the img tag, use the remove function to remove it
});
};
$(document).ready(function(){
$ ('img').css('border','none');
tooltip();
});