将鼠标置于左上方到右下方的图像

<script type=text/javascript src=http://code.jquery.com/jquery-1.8.2.js></script> 
<script type=text/javascript> 
$(document).ready(function(){ 
$("#image").mousemove(function(e) { 
    $("#pop-up").fadeIn(0); 
    $("#pop-up").offset({ 
     top: e.pageY - $("#pop-up").outerHeight()+2, 
     left: e.pageX - ($("#pop-up").outerWidth()+18) 
    }); 
}).mouseleave(function() { 
    $("#pop-up").fadeOut(250); 
        }); 
              }); 
</script>

我不确定要设置偏移量，现在图像位于鼠标指针的左上角，我想将它移动到右下角。或者我应该使用jQuery的另一种选择（悬停（）？）将鼠标置于左上方到右下方的图像

HTML代码：

   <div> 
      <span id="pop-up" style="position: absolute; display:none;"> 
      <img src="../images/webp01.png" id="re"></span> 
      <div id="image" style="width:208px; height:318px; margin-left: 150px;"><a href="#"> 
      <img src="../images/webp02.png" border=none /></a></div> 
      </div>

来源

2014-05-21 user2363318

http://jsfiddle.net/8GVFC/2/

$(document).ready(function(){ 
$("#image").mousemove(function(e) { 
    $("#pop-up").fadeIn(0); 
    $("#pop-up").offset({ 
     top: e.pageY+20, // Approximate mouse height: 20 
     left: e.pageX+15 // Approximate mouse width: 15 
    }); 
}).mouseleave(function() { 
    $("#pop-up").fadeOut(250); 
        });            
});

来源

2014-05-21 18:23:09 SteamDev

入住这fiddle出

的JavaScript

$(document).ready(function(){ 
$("#image").mousemove(function(e) { 
    $("#pop-up").fadeIn(0); 
    $("#pop-up").offset({ 
     top: e.pageY - $("#myImage").outerHeight(), 
     left: e.pageX - ($("#myImage").outerWidth()) 
    }); 
}).mouseleave(function() { 
    $("#pop-up").fadeOut(250); 
        });            
});

HTML

<div > 
    <span id="pop-up" style="position: absolute; display:none;"> 
     <img id='myImage' width=30 height=100 src="../images/webp01.png" id="re"> 
    </span> 
    <div id="image" style="border:solid 1px black; width:208px; height:318px; margin-left: 150px;"><a href="#"> 
     <img src="../images/webp02.png" border=none /></a> 
    </div> 
</div>

来源

2014-05-21 18:12:06

将鼠标置于左上方到右下方的图像

回答

相关问题