JavaScript操纵窗口的方法小结

在前面的介绍中,我们讨论过close()方法:


代码如下:

  win = window.open("http://www.jb51.net/", "js");
  win.close();

  JavaScript提供了许多方法与属性,我们可以使用它们来控制窗口。
  移动、滚动、改变大小
  下面的方法(N4+,IE4+)负责个定窗口的移动、滚动以及大小改变操作:


代码如下:

  // 移动窗口的屏幕位置到指定的偏移x 、y(绝对移动)
  window.moveTo(iX, iY)
  // 移动窗口的屏幕位置到指定的偏移x 、y(相对移动)
  window.moveBy(iX, iY)
  // 滚动窗口的屏幕位置到指定的偏移x 、y(绝对滚动)
  window.scrollTo(iX, iY)
  // 滚动窗口的屏幕位置到指定的偏移x 、y(相对滚动)
  window.scrollBy(iX, iY)
  // 改变窗口大小到指定的高度与宽度(绝对改变大小)
  window.resizeTo(iWidth, iHeight)
  // 改变窗口大小到指定的高度与宽度(相对改变大小)
  window.resizeBy(iX, iY)

  注意,这些方法都属于window对象,所以它们智能在当前窗口或者其他可以引用的窗口被执行。如果你想动态设置窗口的位置和尺寸,就可以在窗口创建后使用move和resize方法。
  //form
  注意,控制一个包含其他服务器页面的窗口是不可能的。
  最大化窗口
  我们现在来介绍如何制作一个点击后可最大化窗口的按钮。
  下面看看有关这个按钮的HTML和JavaScript代码:


代码如下:

  <SCRIPT LANGUAGE="JavaScript">
  <!--
  function maximizeWin() {
  if (window.screen) {
  var aw = screen.availWidth;
  var ah = screen.availHeight;
  window.moveTo(0, 0);
  window.resizeTo(aw, ah);
  }
  }
  // -->
  </SCRIPT>
  <FORM><INPUT TYPE="button" VALUE="Maximize" onClick="maximizeWin()"></FORM>

  注意,resizeTo()方法引用整个窗口的尺寸。 //form
  一个悬浮的广告
  在网站上,通过移动广告窗口,能够吸引浏览者的注意力。我们可以通过调用下面的函数来实现让窗口左右移动的效果:


代码如下:

  function makeAd() {
  window.open("adpage.html", "ad", "width=468,innerWidth=468,height=80,innerHeight=80,left=0,top=0");
  }

  下面是页面adpage.html的代码:


代码如下:

  <SCRIPT LANGUAGE="JavaScript">
  <!--
  function startAd() {
  if (window.screen) {
  pos = 0;
  aw = screen.availWidth;
  window.moveTo(pos, 0);
  timerID = setInterval("moveAd()", 50);
  }
  }
  function moveAd() {
  if (pos <= 0) inc = 5;
  // 5 - so it doesn't pass the right edge
  // 10 - accounts for the window chrome
  if (pos + 468 + 10 + 5 > aw) inc = -5;
  pos += inc; a380fa.com
  window.moveTo(pos, 0);
  }
  window.onload = startAd;
  // -->
  </SCRIPT>

  当页面adpage.html装载后,函数startAD()被执行。如果用户的浏览器支持window.screen对象,窗口才能移动,因为我们需要使用window.screen来计算屏幕的宽度。窗口在屏幕的上边界滑动,从左上角(pos=0)一直到右上角。
  通过内建的setInterval()函数,每隔50毫秒移动广告窗口5个象素。如果点击了“stop”按钮,就将执行下面

(0)

相关推荐

  • JS打开新窗口的2种方式

    1.超链接<a href="http://www.jb51.net" title="我们">Welcome</a> 等效于js代码 window.location.href="http://www.jb51.net";     //在同当前窗口中打开窗口 2.超链接<a href="http://www.jb51.net" title="我们" target="_bl

  • js弹出窗口之弹出层的小例子

    [html] 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">  <HTML xmlns="http://www.w3.org/1999/xhtml">  <HEAD>  <TITLE&g

  • js弹出的对话窗口永远保持居中显示

    复制代码 代码如下: <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> .Div_Scroll { positi

  • JS定时关闭窗口的实例

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <style type ="text/css" >    .main{ background-color:Silver; width :200px; height :100px; margin-

  • JS子父窗口互相操作取值赋值的方法介绍

    $("#父窗口元素ID",window.parent.document); 对应javascript版本为window.parent.document.getElementByIdx_x("父窗口元素ID"): 取父窗口的元素方法:$(selector, window.parent.document);那么你取父窗口的父窗口的元素就可以用:$(selector, window.parent.parent.document); 类似的,取其它窗口的方法大同小异$(se

  • JavaScript操纵窗口的方法小结

    在前面的介绍中,我们讨论过close()方法: 复制代码 代码如下: win = window.open("http://www.jb51.net/", "js"): win.close(): JavaScript提供了许多方法与属性,我们可以使用它们来控制窗口. 移动.滚动.改变大小 下面的方法(N4+,IE4+)负责个定窗口的移动.滚动以及大小改变操作: 复制代码 代码如下: // 移动窗口的屏幕位置到指定的偏移x .y(绝对移动) window.moveTo(

  • JavaScript多种页面刷新方法小结

    1,reload 方法 该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页.true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2,replace 方法 方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过"前进"和"后退"来访问已

  • js在ie下打开对话窗口的方法小结

    对话框的性质分为模态对话框和非模态对话框: 1.模态对话框: 打开该对话框之后,在该对话框之外的一切操作都是被禁止的,要想进行其他操作,必须先关闭本对话框. js命令: showModalDialog(); 2.非模态对话框: 和模态对话框相反,打开之后,仍可以进行对话框之外的操作. js命令: showModelessDialog(); 以上就是小编为大家带来的js在ie下打开对话窗口的方法小结全部内容了,希望大家多多支持我们~

  • ASP.NET调用javascript脚本的常见方法小结

    1.直接在前台调用 javascript 函数 很简单,在 head 元素之间加入 script 元素,将 type 元素设置为 " text/javascript " 如: 复制代码 代码如下: <head runat="server"> <script type="text/javascript" > function ShowName(str) { alert("您的名字为:("+str+&quo

  • C#后台调用前台javascript的五种方法小结

    在网上找了找,发现有三种方法可以访问到前台代码: 第一种,OnClientClick (vs2003不支持这个方法) <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="client_click()" OnClick="Button1_Click" /> client_click() 就是javascript的

  • JavaScript面向对象的实现方法小结

    本文实例总结了JavaScript面向对象的实现方法.分享给大家供大家参考.具体分析如下: 方法1: var person = { name: 'hello world', age: 22, sayHello:function(){ alert('I\'m 'this.name ',and I\'m ' this.age 'years old'); } }; person.sayHello();//I'm hello world, and I'm 22 years old 方法2: window

  • 让浏览器非阻塞加载javascript的几种方法小结

    浏览器为了确保正确执行脚本和呈现布局在浏览器加载和执行完成它之前会完全阻塞页面后续内容的呈现和其他资源的加载. 在页面的加载过程中如果可以做到内容的逐步呈现,对于良好的用户体验来说是非常重要的.通常我们也会在wondow对象的onload事件处理函数中做一些事情,但由于脚本阻塞加载和呈现的特性这一方面增加了页面载入时间推迟了onload事件的触发,另一方面也延迟了用户所期待的反馈.这就需要我们使用一些方法来让浏览器以非阻塞的方式加载外部脚本. 一  使用XMLHttpRequest对象异步方式

  • C#隐藏主窗口的方法小结

    本文实例总结了C#隐藏主窗口的方法.分享给大家供大家参考,具体如下: 要求在程序启动的时候主窗口隐藏,只在系统托盘里显示一个图标.一直以来采用的方法都是设置窗口的ShowInTaskBar=false, WindowState=Minimized.但是偶然发现尽管这样的方法可以使主窗口隐藏不见,但是在用Alt+Tab的时候却可以看见这个程序的图标并把这个窗口显示出来.因此这种方法其实并不能满足要求. 方法一: 重写setVisibleCore方法 protected override void

  • JavaScript类的继承方法小结【组合继承分析】

    本文实例讲述了JavaScript类的继承方法.分享给大家供大家参考,具体如下: 在JavaScript 里,被继承的函数称为超类型(父类,基类也行,其他语言叫法),继承的函数称为子类型(子类,派生类).继承也有之前问题,比如字面量重写原型会中断关系,使用引用类型的原型,并且子类型还无法给超类型传递参数. 为了解决引用共享和超类型无法传参的问题,我们采用一种叫借用构造函数的技术,或者成为对象冒充(伪造对象.经典继承)的技术来解决这两种问题. function aObj(){ this.name

  • JavaScript数组去重实现方法小结

    本文实例讲述了JavaScript数组去重实现方法.分享给大家供大家参考,具体如下: 一.ES3方法: var arr = ['a', 'a', 'b', 'b', 'b', 'c', 'e', 'f', 1, 2, 2, 3, 3, 3]; 创建一个空数组与原来数组进行比较 //与前面的数组进行比较(不会改变原数组) function deleteRepeat() { var result = []; label: for(var i=0; i<arr.length; i++) { for(v

随机推荐