Question

给定X和Y坐标，我想定位一个元素，使它在屏幕/窗口的那个位置。

我希望滚动正常工作，因此固定位置不是解决方案。我想要固定的东西但是当滚动时元素应该像普通元素一样移动。

无法保证父html元素的位置是什么。也就是说它可以是静态的，相对的，绝对的或固定的。）

我理解css只有解决方案是不可能的，而且没问题。

Answer 1

相当于固定定位但滚动为position: absolute。它是相对于父位置的，只要它没有静态定位。

在CSS中：

#yourElement {
    position: absolute;
}

在包含x和y值的JavaScript中：

var element = document.getElementById("yourElement");
element.style.left = x + "px";
element.style.top = y + "px";

Answer 2

由于这个仍然是开放的，对JS Fiddle感到无聊......不确定我是否符合你想要的要求？

http://jsfiddle.net/9Lz58n3o/

示例页面

<div> 
    using this div as an example of large text / body contents... can be ignored        
</div>
<div class="myStaticPos" tmpleft="32" tmptop="32" style="left:32px; top:32px;"></div>
<div class="myStaticPos" tmpleft="123" tmptop="123" style="left:123px; top:123px;"></div>

CSS

.myStaticPos {
    position:absolute; 
    background-color:#d00; 
    width:32px; 
    height:32px;
}

的Javascript

$(function() {
  $(window).scroll(function() {
      alignElements();
  });
});

function alignElements() {
    var scrollTop = $(window).scrollTop();
     $( ".myStaticPos" ).each(function() {
         $(this).offset({ top: scrollTop + parseInt($(this).attr("tmptop")), left: parseInt($(this).attr("tmpleft")) });       
    });    
}

上面这个例子和小提琴链接是使用元素偏移的一种方式，无论滚动如何，它总是出现..否则绝对位置是绝对位置..

如果这不能满足您的需求或无法进行调整，请再次验证问题。

将html元素放在页面的任何x / y坐标处

2 个答案: