屏幕外滚动弹出窗口

Question

我们打开弹出窗口。我们希望将其滑出屏幕。可以尽可能地制造“右”和“上”部分。我们如何滑出屏幕？

var wind = window.open("https://www.google.com","","width=50,height=50,left=1500%,top=1000%");

Answer 1

虽然我不确定您的特定用例，但是通过切换不透明度和右/左，您可以实现div退出屏幕的“效果”。

function move() {
  let element = document.getElementById("box");
  element.style.transform = "translate(-400px)";
  element.style.right = 0;
  element.style.opacity = 0;
}

#box {
  width: 300px;
  height: 200px;
  background: blue;
  margin-bottom: 20px;
  color: white;
  transition: all 0.3s ease;
  opacity: 1;
  position: absolute;
}

#btn {
  margin-top: 300px;
}

<div id="box">Hello</div>

<button id="btn" onclick="move()">Click</button>