javascript实例教程(13) 鼠标触发窗口

2016-01-29 11:30 6 1 收藏

javascript实例教程(13) 鼠标触发窗口,&#106avascript实例教程(13) 鼠标触发窗口

【 tulaoshi.com - Javascript 】

  利用Javascript产生鼠标移过时弹出窗口

本节教程将介绍当鼠标移过图片的时候弹出一个窗口的设计。这个弹出的窗口是一个标准的网页,你可以设置它的大小。

首先在网页的Header标签处加入以下代码:

<SCRIPT LANGUAGE="Javascript"

var popupwindow_window = null;

function popupwindow(status,url) {

if(status != 0) {

if(popupwindow != null) popupwindow.focus();

else {

var popupwindow = open(url, "popupwindow", "width=350,height=225");

//这里设置弹出窗口的大小,宽度为350,高度为225.

popupwindow_window = popupwindow;

}

} else {

if(popupwindow_window != null) popupwindow_window.close();

}

}

</SCRIPT

那如何调用这个JavaScript脚本呢?具体代码如下:

This is your link <A HREF="" onMouseover="popupwindow(1,'popupwindow.html')"

onMouseout="popupwindow(0)"<img src="http://img.jcwcn.com/attachment/portal/jcwcj/2005-12/10/05121012343516898.gif"

hspace=0 vspace=0 border=0 alt="Network"</A

这样你只要将鼠标移过图片picture.gif的时候,就会弹出一个宽度为350,高度为225的网页了。

点击此处去测试效果页面


(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/javascript/) 

来源:http://www.tulaoshi.com/n/20160129/1482510.html

延伸阅读
  HoTMetal中使用Javascript 6.怎样编写一个保存模块脚本 在本节教程的例子中,我们创建了一个新的保存模块文件对话框。HoTMetaL里面有几个模板你可以从中进行选择。模板只是一个普通的网页,这个网页被保存HoTMetaL应用程序目录的Template模板中。当你从文件菜单中选择新项目的时候,其中一个标签选项是Page From Template。当你选择...
  使用JavaScript中的OLE Automation 6. 怎样提高脚本程序的性能 自从我们处理重的对象模型(比如Word.Application)和应用程序实例,注意系统的资源示相当重要的。一旦我们完成对应用程序实例的处理,我们必须去掉它,以从内存重清除对象的实例。在Jscript中有唯一的方法来实现,它就是应用程序对象的Quit()方法,以下是一个例子: va...
  使用JavaScript中的OLE Automation 7. 怎样处理集对象 Automation对象与其它的Jscript对象有些有相同的结构。它暴露了多种方法和属性,我们可以对它们进行处理。如果你从来没有接触Visual Basic,你可能就不熟悉集对象了。集就是相关项的组。集用在Visual Basic主要是为了保持跟踪许多事情,比如从你的程序(表单集)中装载表单,或者...
  有时你可以会在一些网站看到一些变化显示的图片,这除了可以利用Flash来制作之外,当然也可以利用本节教程介绍的方法来实现哦。好吧,就开始我们的创作吧。我们可以在网页的最前面部分添加以下的代码来创建一个随机的数字: <SCRIPT <!-- // Randomizer rnd.today=new Date(); rnd.seed=rnd.today.getTime(); function rn...
  利用Javascript创建一个“后退”连接 在JavaScript中实现一个“后退”连接是相当容易的。这个“后退”连接的功能的作用就象网页中“后退”按钮一样,具体你可以使用以下代码: <FORM <input type=button value="Go Back" onClick="history.back(-1)" </FORM 你仔细点就会发现,这段代码实际上是使用了history.back()函...

经验教程

599

收藏

38
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部