<script type="text/javascript">
$(function()
{
$('#left').mousemove(function(e){
$('#mousepic').html(e.pageX+'>'e.pageY);
$('#mousepic').css('left',e.pageX-75).css('top',e.pageY-30);
})
});
</script>
</head>
<body>
<div id="left">
<img src="images/1_m.jpg"/>
<div id="mousepic"></div>
<div id="bigpic"></div>
</div>
</body>
------ Solution ------------------------------------- -------
$ ('# mousepic'). html (e.pageX + '>' e.pageY);
---------------------------------- modify ----------- -----
$ ('# mousepic'). html (e.pageX + '>' + e.pageY);
------ Solution ------------- -------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script>
$(function(){
$('#left').mouseover(function(e){
$('#mousepic').html(e.pageX+'>'+e.pageY);
$('#mousepic').css({position: "absolute"});
$('#mousepic').css("left",e.pageX-75);
$('#mousepic').css("top",e.pageY-30);
})
});
</script>
</head>
<body>
<div id="left">
<img src="images/psb.jpg" width="100px" height="50px"/>
<div id="mousepic" style="border:1px solid blue;"></div>
<div id="bigpic"></div>
</div>
</body>
</html>
------ For reference only - --------------------------------------
you have referenced jquery js file do ?
------ For reference only ------------------------------------ ---
useful :
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
------ For reference only ----------------------------------- ----
here positive solution, you need to perform absolute positioning ....
------ For reference only ------------------ ---------------------
$ ('# mousepic'). css ({position: "absolute"});
没有评论:
发表评论