调整大小时移动元素

Question

我有一个黑匣子

<div id="blackbox" style="margin-left:0px; background-color:black; width:20px; height:20px;">

onresize，从 screen.width 每减少 1px 应该增加 'blackbox'.margin-left 2px.

调整大小触发的视差

需要将其翻译成 javascript

    function move() {
        var screenwidth = screen.width
        var innerwidth = window.innerwidth
        var x = screenwidth - innerwidth
        document.getElementById("blackbox").style.marginLeft = (x * 2) + "px";
    }
        window.onresize = move;

Answer 1

这是一个区分大小写的问题。您要查找的属性是 "innerWidth"，大写 "W"，而不是 "innerwidth"。调整您的代码：

function move() {
  var screenwidth = screen.width
  var innerwidth = window.innerWidth
  var x = screenwidth - innerwidth
  document.getElementById("blackbox").style.marginLeft = (x * 2) + "px";
}
window.onresize = move;

<div id="blackbox" style="margin-left:0px; background-color:black; width:20px; height:20px;">

调整大小时移动元素

Move element on resize

javascript

parallax

onresize