<-- try to move the new window diagonally with live server but the set interval doesn't work i trace it with debug i saw it's not working
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="move">Move</button>
<button id="close">Close</button>
<script >var win = window.open('https://www.google.com', '', 'width= 150 height =150');
var x = 50,
y = 50;
var a = 20,
b = 20;
var move = true;
function movebyf() {
while (move) {
win.moveBy(x, y);
win.focus();
if (a > 426 || b > 406) {
x = -50;
y = -50;
a -= 50;
b -= 50;
} else {
a += 50;
b += 50;
}
}
}
document.getElementById('close').addEventListener('click', () => {
win.close();
move = false;`enter code here`
});
setInterval(movebyf, 2000);</script>
</body>
</html>
hi!,
i found it interesting and then i created one example for you, in reality your code has an error in “width=150, height =150” you forgot a comma.
But, this is one of the problems, it isn’t necessary to put a loop while in the code, since put a interval.
Other points , the url google can’t call many times and it’s var win doesn’t instantiate the DOM window object to manipulate in another scope ( i don’t know why ).
So, i created one class to manipulate the win object to open and others manipulations
<script>
let x=50, y=50, a=20, b=20;
let windowGoogle;
let movingWindow;
class WindowGoo{
constructor(width, height){
this.height = height;
this.width = width;
this.win = window.open('', '', `width=${this.width},height=${this.height}`);
}
move(x,y){
this.win.moveBy(x,y);
this.win.focus();
}
closedWin(){
this.win.close();
}
}
document.getElementById('move').addEventListener('click', () => {
windowGoogle? clickClose() : ""
windowGoogle = new WindowGoo(250, 250);
movingWindow = setInterval(() => {
if (a < 400 || b < 400) {
x += 50;
y += 50;
a += 50;
b += 50;
windowGoogle.move(x, y);
} else {
clearInterval(movingWindow);
}
}, 500);
});
const clickClose = () => {
x = 50;
y = 50;
a = 20;
b = 20;
clearInterval(movingWindow);
windowGoogle.closedWin();
}
</script>
I didn’t really unsdertand what mechanics you would like to give to the system using variables a and b, so I just exemplified it to be able to refactor.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.