我是小又又，住在武汉，做了两年新媒体，准备用 6 个月时间转行前端。
今日学习目标
昨天主要基于搜索基础学习 BOM window 对象基础定义和宽度高度相关属性 ，今天主要开始基于搜索基础学习控制窗体移动和大小变化,又是适合学习的一天，加油，小又又！！！！
今日学习概要
- window.resizeBy()
- window.resizeTo()
- window.moveBy()
- window.moveTo()
window.resizeBy()
基础语法
window.resizeBy(xDelta, yDelta)
参数说明
xDelta 为窗口水平方向变化的像素值。
yDelta 为窗口垂直方向变化的像素
详细说明
调整窗口大小。
该方法相对于窗口当前大小来调整该窗口的大小。要以绝对大小方式调整窗口的大小，可使用 window.resizeTo。
从 Firefox 7，依据下面的规则，不能再调整浏览器内一个窗口的默认大小了：
- 不能调整非 window.open 方法打开的窗口或 Tab 的大小。
- 当一个窗口内包含有一个以上的 Tab 时，不能调整窗口的大小。
案例
window.resizeBy(-200, -200);
没有效果啊~~~~
window.resizeTo()
基础语法
window.resizeTo(aWidth, aHeight)
参数说明
aWidth 是一个整数，表示新的 outerWidth（单位：像素）（包括滚动条、窗口边框等）。
aHeight
是一个整数，表示新的 outerHeight（单位：像素）（包括滚动条、标题栏、窗口边框等）。
详细说明
动态调整窗口的大小。
从 Firefox 7 开始，不能改变浏览器窗口的大小了，要依据下面的规则：
- 不能设置那些不是通过 window.open 创建的窗口或 Tab 的大小。
- 当一个窗口里面含有一个以上的 Tab 时，无法设置窗口的大小。
案例
// 将窗口设置为整个屏幕的 1/4 大小（面积）
function quarter() {
window.resizeTo(
window.screen.availWidth / 2,
window.screen.availHeight / 2
);
}
quarter();
没效果???????
window.moveBy()
基础语法
window.moveBy(deltaX, deltaY)
参数说明
deltaX 表示窗口在水平方向移动的像素值。
deltaY 表示窗口在垂直方向移动的像素值。
详细说明
根据指定的值，移动当前窗口。
可以使用负值作为该函数的参数。该函数产生相对移动，而 window.moveTo 产生一个绝对移动。
从 Firefox 7 开始，依据下面的规则，不能再移动一个浏览器里的窗口。
- 不能移动非 window.open 创建的窗口或 Tab。
- 当一个窗口里有多于一个 Tab 时，不能移动该窗口。
案例
function budge() {
moveBy(1000, -1000);
}
budge();
好像没看到变化~~
window.moveTo()
基础语法
window.moveTo(x, y)
参数说明
x 是要移动到的位置横坐标
y 是要移动到的位置纵坐标
详细说明
将当前窗口移动到指定的坐标位置。
案例
function origin() {
// 把窗口移动到左上角
window.moveTo(0, 0);
}
origin();
为啥没效果?????
今日学习总结
今日心情
今天主要基础了解了一下控制窗体移动和大小变化,为何都没效果呢,好难受,希望明天学习更多~~~~
本文使用 mdnice 排版
