日期:2014-05-16  浏览次数:20319 次

javascript权威指南学习5
getWindowX/Y() return the position of the window on the screen
getViewportWidth/Height() return the size of the document
getDocumentWidth/Height() return the size of the document
getHorizontalScroll()  return the position of the horizontal scrollbar
getVerticalScroll() return the position of the vertical scrollbar

14.3.2Screen对象
width和height属性指定的是以像素为单位
的显示器的大小
availWidth和availHeight指定的是实际可用的显示器大小

14.3.3  Navigator

Navigator对象的五个属性
appName Web浏览器的简单名称。IE 是 "Microsoft Internet Expllorerr"
Firefix 是 Netscape

appVersion
浏览器的版本号

userAgent
浏览器在他的USER-AGENT HTTP头部中发送的字符串
这个属性通常包含 appName appVersion

appCodeName 浏览器的代码名

platform
运行浏览器的硬件平台

14.4打开和操作窗口
14.4.1打开窗口
Window对象的open()方法
Widow对象的open()方法可以打开一个新的浏览器窗口
广告就是使用Window.open()方法来进行“弹出”或“滚动”

Window.open()方法有四个可选参数
第一个参数是要在新窗口中显示的文档的URL,如果这个参数
被省略了,那么新打开的窗口将是空的。
open()的第二个参数是新打开的窗口名字.
这个名字可以作为<a>标记或<form>标记的
target属性的值,如果指定的是一个已经存在的窗口名字
那么open()使用的就是那个已经存在的窗口

open()的第三个参数是特性列表,这些特性声明了窗口的大小
和它的GUI装饰。
var w = window.open("smallwin.html","smallwin",
"width=400,heigth=350,status=yes,resizable=yes");
当指定第三个参数是,所有没有明确的特性都会被省略

open()的第四个参数只在第二个参数命名的是一个存在的窗口时才有用。
它是一个布尔值,声明了有第一个参数指定的URL是应该替换掉窗口浏览器的当前项(true)
还是应该在窗口浏览器历史中创建一个姓的项(false)、后者是默认的设置



open()的返回值是代表新创建的窗口的Window对像。
窗口的opener属性引用的是打开它的窗口。如果窗口是由用户创建的,而不
是有Javascriptdaima 创建的,那么它的opener属性就是null
14.4.2关闭窗口
close()
关闭窗口w
w.close();
即使一个窗口关闭了,代表他的Window对像 仍然存在。


14.4.3窗口的几何大小
Window 对象定义了移动窗口和重新设置窗口大小的方法
方法moveTo()可以将窗口的左上角移动到指定的坐标。
moveBy()可以将窗口上下左右移动
resizeTo()
resizeBy()可以按照相对数量和绝对 数量调整窗口的大小
14.4.4键盘焦点和可见性
focus()请求系统将键盘焦点赋予窗口
blur()放弃键盘焦点
focus()还会把窗口移到堆栈的顶部

14.4.5滚动
1.scrollBy() 会将窗口中显示的文档向上下左右滚动指定数量的像素
scrollTo()会将文档滚动到一个绝对的位置
2.offsetLeft和offsetTop属性来指定元素的X和Y坐标。
一旦已经确定了元素的位置,可以使用scrollTo()来滚动一个窗口,
以使任何指定元素位于窗口的左上角位置
3.调用文档元素的foucs()方法,它可以接收键盘焦点。
4.大多数现在浏览器支持另一种有用的滚动方法,就是在任意的
HTML元素上调用scrollIntoView()方法是改元素可见
5.在所有想要滚动文档的地方使用<a name=>标记定义锚然后,通过Location
对象的hash属性来使用这些锚名。
window.location.hash = "#top";
window.location.replace("#top");

14.4.6Window方法实例
var bounce = {
x:0,y:0,w:200,h:200,
dx:5,dy:5,
interval:100,
win:null,
timer:null,
start:function(){
bounce.x = (screen.width - bounce.w)/2;
bounce.y = (screen.height - bounce.h)/2;
bounce.win = window.open('javascript:"<h1>BOUNCE</h1>"',"","left="+bounce.x+",top="+bounce.y+",width="+bounce.w+",height="+bounce.h+",status=yes");
bounce.timer = setInterval(bounce.nextFrame,bounce.interval);
},
stop:function(){
clearInterval(bounce.timer);
if(!bounce.win.closed)bounce.win.close();
},
nextFrame:function(){
if(bounce.win.closed){
clearInterval(bounce.timer);
return;
}
if((bounce.x+bounce.dx>(screen.availWidth-bounce.w))||
(bounce.x+bounce.dx<0))bounce.dx=-bounce.dx;

if((bounce.y+bounce.dy>(screen.availHeight-bounce.h))||
(bounce.y+bounce.dy<0))bounce.dy=-bounce.dy;

bounce.x+=bounce.dx;
bounce.y+=bounce.dy;
bounce.win.moveTo(bounce.x,bounce.y);
bounce.win.defaultStatus = "("+bounce.x+","+bounce.y+")";
}

}


14.5简单的对话框
alert()
confirm()
prompt()

14.6脚本化状态栏


defaulStatus属性

var WastedTime = {
start: new Date(),
displayElapsedTime:function(){
var elapsed = Math.round((now-WastedTime.start)/60000);
window.defaultStatus = "You hava wasted "+elapsed+"