1

嗨，我有这篇文章的代码示例。我想要的是当光标经过超链接或任何类型的“a”链接时显示在光标旁边的 png 图像。

这是原文：

var $img = $('img');
$img.hide();
$('div').mousemove(function(e) {
  $img.stop(1, 1).fadeIn();
  $('img').offset({
    top: e.pageY - $img.outerHeight(),
    left: e.pageX - $img.outerWidth()
});
}).mouseleave(function() {
$img.fadeOut();
});

HTML：

<div>
<img src="http://i574.photobucket.com/albums/ss184/wsganewsletter/Other/Icon-Mega.png"    
/>
</div>

这是我尝试修改的版本而不使用 HTML 并且仅通过 jQuery 加载图像：S

*var img = $("../Cursor.png");
$img.hide();
$('a').mousemove(function(e) {
  $img.stop(1, 1).fadeIn();
  $('img').offset({
    top: e.pageY - $img.outerHeight(),
    left: e.pageX - ($img.outerWidth()/2)
});
}).mouseleave(function() {
$img.fadeOut();
});?

我敢肯定这是一个相对容易的解决方法，我仍然倾向于，请你帮帮我。谢谢 ：）

4

3 回答 3

2

这正是您所需要的。

<script type="text/javascript">
    $(document).ready(function() {
        var $img = $("#cursor");
        $img.hide();
        $('a').mousemove(function(e) {
            $img.stop(1, 1).fadeIn();
            $img.offset({
                top: e.pageY - $img.outerHeight(),
                left: e.pageX - ($img.outerWidth()/2)
            });
        }).mouseleave(function() {
            $img.fadeOut();
        });
    });
</script>

<img id="cursor" src="http://i574.photobucket.com/albums/ss184/wsganewsletter/Other/Icon-Mega.png" style="position: absolute">
<a href="#">hover me</a>
于 2012-11-15T07:58:47.483 回答
0

您需要像这样设置一个 img 标签：

var img = $('<img src="../Cursor.png"/>');
于 2012-11-15T07:44:40.810 回答
0

你必须构造 DOM 元素 - 比如：

var img = $("<img id='myimg' src='../Cursor.png' />");
于 2012-11-15T07:44:44.540 回答