将变量传递到.css以设置顶部和左侧位置

Question

我知道与此有关的还有其他问题，但是似乎没有一种解决方案适合我。 我无法获得“顶部”和“左侧”位置来读取上面定义的变量（YOff，XOff）。 它始终默认为0,0。 任何帮助，将不胜感激。 对于它的价值，我知道变量可以正确计算，因为我提醒它们进行验证。

$(document).ready(function(){    
    $('.marker').mouseover(function(e){
        var location = $(this).attr("id");
        var offset_t = $(this).offset().top - $(window).scrollTop();
        var offset_l = $(this).offset().left - $(window).scrollLeft();

        var XOff = Math.round( (e.pageX - offset_l) );
        var YOff = Math.round( (e.pageY - offset_t) );

        $('.city').hide();
        $("#" + location + "-market")
        .show()
        .css({
            top: YOff, 
            left: XOff
        });

    });                
    $('.city').mouseleave(function(){
        $('.city').hide();
    }); 
});

有关我要执行的操作的详细信息...在地图（bg图像）上，将鼠标悬停在具有绝对位置的城市（.marker）上时，我有一个div（＃+ location + -market）显示，其中包含有关该城市的一些信息。 我想让那个div靠近城市。

Answer 1

$("#selector").css({"top":YOff+ "px","left":XOff+ "px","position": "absolute" });

看到修改过的小提琴的实际效果：-http: //jsfiddle.net/md4cD/

Answer 2

查看-This Link-，我将您的.css()函数更改为：

$("#" + location + "-market").show().offset({
    top: YOff, left: XOff
});

这使您的jquery文件看起来像这样：

$(document).ready(function(){ 
    $('.marker').mouseover(function (e) {
        var location = $(this).attr("id");
        var offset_t = $(this).offset().top - $(window).scrollTop();
        var offset_l = $(this).offset().left - $(window).scrollLeft();

        var XOff = Math.round((e.pageX - offset_l));
        var YOff = Math.round((e.pageY - offset_t));

        $('.city').hide();
        $("#" + location + "-market").show().offset({
            top: YOff, left: XOff
        });
    });

    $('.city').mouseleave(function () {
        $('.city').hide();
    });
});

小提琴在这里 。 希望这会产生您想要的结果！