我尝试创建一个这样的“页面'地图'-概述” (甚至更复杂的这样)但是我坚持计算,不知道问题在哪里或如何消除。
这是我到目前为止所做的:
var Overview = (function() {
$('.spot').each(function() {
var el = $(this),
map = $('#map'),
point = document.createElement('span');
point.className = 'point';
map.append(point);
var offsetX = el.offset().left, // Might the problem is here,
offsetY = el.offset().top, // and here?!
winW = $(window).width(),
winH = $(window).height(),
mapWidth = map.width() - $(point).width(),
mapHeight = map.height() - $(point).height(),
posX = offsetX / winW * mapWidth,
posY = offsetY / winH * mapHeight;
$(point).css({
top: posY,
left: posX
});
});
})();
我想不通,问题出在哪里。任何想法如何修复或改进我的计算?