技术群: 47185411 54518032 80369256 网站地图 RSS地图  启明星网络推荐:PHP / FLASH / Flex / DIV+CSS 培训火热报名中 订阅RSS
首页 > 学习认证 > 网络学习 > 网页技巧全集(二)

网页技巧全集(二)

时间:2010-9-2 浏览: 作者:admin
21,Q:只有程序员才能使用ActiveX控件吗?A:了解脚本语言,比如说VisualBasicScriptingEdition(VBScript)或JavaScript,自然对使用ActiveX控件

21,Q:只有程序员才能使用 ActiveX 控件吗?
     A:了解脚本语言,比如说 Visual Basic Scripting Edition(VBScript) 或 JavaScript,自然对使用ActiveX 控件非常有帮助。但也并非一定要有这样的程序开发基础。对于有些控件来说,需要写一定数量的脚本程序,才能集成到网页中,但大多数 ActiveX 控件却不需要这样。使用 ActiveX Control Pad,即使是非程序开发人员也可以通过简单的选中和点击将很多控件插入网页。
  22,Q:在创建了包含 ActiveX 控件的网页后,如果用户在自己的机器上浏览该网页,控件是如何在用户终端机上安装和显示的?
     A:当 IE3.0 遇到含有 ActiveX 控件(或复合控件)的网页时,首先检查用户的本地系统注册,察看该组件是否已经安装在本地机上了。如果该组件已经在本地机上,IE3.0 显示该网页并激活控件。如果控件还未在用户本地机上安装,IE3.0 将自动地根据开发者创建网页时的地址定义,从网上找到此控件,并将它安装到本地机上。
  23,Q:如何在网页上定义一个地址,使用户访问网页时,控件可以自动下载到用户的计算机上?
     A:网页开发者可以通过给控件设置 CODEBASE 属性提供上述信息。使用 ActiveX Control Pad 时,在 ObjectEditor 中,可以看见一个属性表,开发者可以很方便地利用该表设置属性。通过设置属性,可以定义 URL 地址或地址集,通过地址可以在 Internet 上找到并下载控件。IE3.0 正是利用这些地址信息,定位控件并自动下载组件的。下载之后,网页就出现在本地机上了。在 1996 年 7 月的 Microsoft Systems Journal 上,“Safe Web Surfing with the Internet Component Download Service”一文详细论述了整个信息定位及下载过程。需要一提的是,许多 Microsoft 提供的控件(例如 HTML Layout Control)不需要 CODEBASE 设置,因为通过 ActiveX 对象索引(ActiveX Object Index)就可以基于 CLSID(控件唯一标识符)自动找到并定位控件。
  24,Q:ActiveX 组件下载时,是否通知用户?
     A:是的。当一个组件需要下载时,IE 会缺省地显示一个消息框,通知用户将要开始下载。用户可以选择终止下载或继续下载。如果控件做过数字签名,会提供一份数字认证书, 其中包括提供该控件的软件供应商名字,以及确认该控件未被破坏的有关信息。软件开发者在开发控件时可以做数字签名。签名信息由控件本身携带, 因此在下载之前,会自动显示数字验证书,在网页上使用该控件的用户不需要做任何开发工作。
  25,Q:ActiveX 控件下载后,放在什么位置?
     A:在缺省情况下,控件下载后要放在 \windows\Downloaded Program Files 目录下的 ActiveX 控件高速缓存中。
  26,Q:如何对待新创建的新版本控件? 如果用户计算机上已经有了老板本的控件 IE 如何知道应该下载新版本的控件?
     A:I3.0 中的组件下载服务(Component Download Service)提供了版本控制功能,使用此项功能,新版本的控件会被自动检测出来,并可自动下载。在1996 年 7 月的 Microsoft Systems Journal 杂志上,“Safe Web Surfing with the Internet Component Download Service”一文 详细论述了整个版本控制过程。
  27,Q:ActiveX 控件是否有许可权问题? 用户下载控件之后能否在自己的网页上使用 ActiveX 控件?
     A:ActiveX 控件提供一套完整的保护机制,可以防止未经许可的用户在网页上使用 ActiveX 控件。到目前为止,已经有一些开发工具支持这套机制,例如 VB、Ms Access、和 IE。现有的控件授权许可证机制有两种许可形式:开发许可证和运行使用许可证。开发许可证允许许可证的持有者使用控件,利用 VB,ActiveX ControlPad, 以及其它有关的开发工具,从事以开发为目的活动。运行使用许可证只允许许可证的持有者在已有的应用或网页中显示控件,不允许将控件插入有关工具中,用于开发目的活动。支持许可证机制是独立控件开发上的工作。有些控件开发商选择了不支持许可证机制的开发策略,因此对任何用户来说,他们开发的控件一旦被安装到本地机上,就可以用于开发。另一些控件开发商只提供免费的运行许可证,而在提供开发许可证时需要收费。需要在网上使用控件的用户,应该详细地阅读控件开发商提供的许可证协议,以确定自己使用控件的权限。
  28,Q:为什么有些控件,甚至包括有些 VB4.0 自带的 ActiveX 控件,在网页上都无法用 IE 显示?
     A:包括 VB4.0 中某些控件在内的许多控件都提供了许可证机制。要在网上使用这些控件必须取得相应的运行使用许可证,并将相应的许可证文件放在网页中,否则,在用户终端机上将无法显示该控件。对于某一控件来说,只有控件的合法开发者,才拥有为该控件进行“运行许可权”授权的权利。 欲知在网页中获得控件运行许可权的详细过程, 请参见 ActiveX SDK 文档中有关许可证控制部分(在新的ActiveX Control Pad FAQ 中,还有一个具体例子)。 值得一提的是,Microsoft 及其第三方合作伙伴也在网上提供了大量的具有免费使用权许可证的 ActiveX 控件。在网页中使用这些控件时,不需要提交使用权许可证文件。
  29,Q:HTML Layout 控件如何增强了使用 ActiveX 控件开发网页的能力?
     A:HTML Layout 控件支持由 W3C 公布的扩展 HTML,允许在网页上精确定位对象。原先,HTML 不允许网页开发者使用 X、Y 坐标在网页上精确定位元素,也不允许叠盖对象。新增加的的“2-D”布局功能,使开发者可以完成更复杂的设计,为用 户开发出更好的网络应用提供了支持。通过实现新的 W3C HTML 扩展,HTML Layout 控件为在 IE 中显示的 ActiveX 控件提供了更先进的布局选项。HTML Layout 控件是 IE3.0 的新增组件,并被集 成到 IE 完全安装版中。(HTML Layout 控件也是 ActiveX ControlPad 的一部分,可通过 MSDN 库安装。由于提供了基于 WYSIWYG(所见即所得)页的全帧编辑器,ActiveX Control Pad 可以与 HTML Layout Control 相结合使用。 这使得用 ActiveX 控件开发先进的二维风格的 HTML 设计变得更加简单。
  30,Q:怎样在网页上显示多少人在线(on-line)?
    A:只要你的网站支持 ASP,那么在网站的根目录中放置以下内容的 Global.asa 文件,问题就解决了。将语句 〈% response.write "现在有 " & Application("WhosOn") & " 人在线。" %〉 放在你的 ASP 网页中用于显示在线人数。
   <SCRIPT LANGUAGE="VBScript" RUNAT="Server">
            Sub Application_OnStart
            Session.Timeout=1
            Application.Lock
            Application("WhosOn") = 0
            Application.UnLock
            End Sub
            Sub Session_OnStart
            Application.Lock
            Application("WhosOn") = Application("WhosOn") + 1
            Application.UnLock
            End Sub
            Sub Session_OnEnd
            Application.Lock
            Application("WhosOn") = Application("WhosOn") - 1
            Application.UnLock
            End Sub
            </SCRIPT>
 
  31,Q:用样式表(CSS)定制表格边框:
    A:
    〈Table border=0 id=tb1 style="border:3px solid red"〉
    〈tr〉〈td〉用样式表(CSS)定制表格的例子〈/td〉〈/tr〉
    〈/Table〉
  32,Q:闪亮的表格边框:
    A:
   <table border="0" width="280" id="tb1" style="border:3px solid green">
   <tr>
   <td>
     制做闪亮的表格边框!
   </td>
   </tr>
   </table>
   <script language="JavaScript">
   <!-- 这段脚本放在表格的后面
   function flashit()
   {
   if (!document.all) return
   if (tb1.style.borderColor=="green")
   tb1.style.borderColor="red"
   else
   tb1.style.borderColor="green"
   }
   setInterval("flashit()", 400)
   //-->
   </script>
  33,Q:JavaScript 实现的简单时钟:
    A:
   (1)在〈Head〉〈/Head〉之间放置以下脚本:
   <script language="JavaScript">
   <!--
   var timerID = null;
   var timerRunning = false;
   var id,pause=0,position=0;
   function stopclock ()
   { if(timerRunning)
   clearTimeout(timerID);
   timerRunning = false;
   }
   function showtime ()
   {
   var now = new Date();
   var hours = now.getHours();
   var minutes = now.getMinutes();
   var seconds = now.getSeconds()
   var timeValue = "" + ((hours >12) ? hours -12 :hours)
   timeValue += ((minutes < 10) ? ":0" : ":") + minutes
   timeValue += ((seconds < 10) ? ":0" : ":") + seconds
   timeValue += (hours >= 12) ? " P.M." : " A.M."
   document.clock.face.value = timeValue;
   timerID = setTimeout("showtime()",1000);
   timerRunning = true;
   }
   function startclock ()
   { stopclock();
   showtime();
   }
   //-->
   </script>
   (2)在〈Body〉属性中加 onLoad="startclock()"
   (3)在〈Body〉〈/Body〉中间加
   <form name="clock" onSubmit="0">
   <div align="center">
   <center><p><input type="text" name="face" size="13" value></p></center>
   </div>
   </form>
   即可。
  34,Q:自动滚动屏幕文字:
    A:
   <Script Language="JavaScript">
   var position = 0;
   function scrollit()
   {
   if (position != 640 ){
   position++;
   scroll(0,position);
   clearTimeout(timer);
   var timer=setTimeout("scrollit()",25);
   timer;
   }
   }
   </Script>
   以上脚本加在〈Head〉〈/Head〉中间,再在〈BODY〉属性中加 Onload="scrollit()"。
  35,Q:“下雨”JavaScript 脚本:
    A:将以下脚本放在〈Body〉〈/Body〉中间即可:
   <Script Language="JavaScript">
   <!-- Begin
   var no = 50;
   var speed = 1;
   var ns4up = (document.layers) ? 1 : 0;
   var ie4up = (document.all) ? 1 : 0;
   var s, x, y, sn, cs;
   var a, r, cx, cy;
   var i, doc_width = 800, doc_height = 600;
   if (ns4up) {
   doc_width = self.innerWidth;
   doc_height = self.innerHeight;
   }
   else
   if (ie4up) {
   doc_width = document.body.clientWidth;
   doc_height = document.body.clientHeight;
   }
   x = new Array();
   y = new Array();
   r = new Array();
   cx = new Array();
   cy = new Array();
   s = 8;
   for (i = 0; i < no; ++ i) {
   initRain();
   if (ns4up) {
   if (i == 0) {
   document.write("<layer name=\"dot"+ i +"\" left=\"1\" ");
   document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">");
   document.write(",</font></layer>");
   }
   else {
   document.write("<layer name=\"dot"+ i +"\" left=\"1\" ");
   document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">");
   document.write(",</font></layer>");
   }
   }
   else
   if (ie4up) {
   if (i == 0) {
   document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
   document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
   document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
   document.write(",</font></div>");
   }
   else {
   document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
   document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
   document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
   document.write("’</font></div>"); //设定雨点的字符
   }
   }
   }
   function initRain() {
   a = 6;
   r[i] = 1;
   sn = Math.sin(a);
   cs = Math.cos(a);
   cx[i] = Math.rAndom() * doc_width + 1;
   cy[i] = Math.rAndom() * doc_height + 1;
   x[i] = r[i] * sn + cx[i];
   y[i] = cy[i];
   }
   function makeRain() {
   r[i] = 1;
   cx[i] = Math.rAndom() * doc_width + 1;
   cy[i] = 1;
   x[i] = r[i] * sn + cx[i];
   y[i] = r[i] * cs + cy[i];
   }
   function updateRain() {
   r[i] += s;
   x[i] = r[i] * sn + cx[i];
   y[i] = r[i] * cs + cy[i];
   }
   function raindropNS() {
   for (i = 0; i < no; ++ i) {
   updateRain();
   if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
   makeRain();
   doc_width = self.innerWidth;
   doc_height = self.innerHeight;
   }
   document.layers["dot"+i].top = y[i];
   document.layers["dot"+i].left = x[i];
   }
   setTimeout("raindropNS()", speed);
   }
   function raindropIE() {
   for (i = 0; i < no; ++ i) {
   updateRain();
   if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
   makeRain();
   doc_width = document.body.clientWidth;
   doc_height = document.body.clientHeight;
   }
   document.all["dot"+i].style.pixelTop = y[i];
   document.all["dot"+i].style.pixelLeft = x[i];
   }
   setTimeout("raindropIE()", speed);
   }
   if (ns4up) {raindropNS(); }
   else
   if (ie4up) {raindropIE(); }
   // End -->
   </Script>
  36,Q:“地震”JavaScript 脚本:
    A:将以下脚本放在〈Body〉〈/Body〉中间即可:
   <script language="JavaScript1.2">
   <!--
   function shake(n)
   {
   if (window.top.moveBy)
    {for (i = 10; i > 0; i--)
     {for (j = n; j > 0; j--)
      {window.top.moveBy(0,i);
       window.top.moveBy(i,0);
       window.top.moveBy(0,-i);
       window.top.moveBy(-i,0);
      }
     }
    }
   }
   //-->
   </script>
   <form><input onclick="shake(2)" type="button" value="地震啦!"></form>
  37,Q:一个用 JavaScript 实现的简陋的计算器:
    A:全部代码如下:
   <html>
   <head>
   <script language="JavaScript">
   <!--
   function compute(obj)
   {obj.expr.value = eval(obj.expr.value)}
   var one = '1'
   var two = '2'
   var three = '3'
   var four = '4'
   var five = '5'
   var six = '6'
   var seven = '7'
   var eight = '8'
   var nine = '9'
   var zero = '0'
   var plus = '+'
   var minus = '-'
   var multiply = '*'
   var divide = '/'
   var decimal = '.'
   function enter(obj, string)
   {obj.expr.value += string}
   function clear(obj, string)
   {obj.expr.value = ''}
   //-->
   </script>
   </head>
   <body>
   <form name="calc">
   <table border=1>
   <tr align="right">
   <td colspan=4><input name="expr" action="compute(this.form)"></td>
   </tr>
   <tr align=center>
   <td><input type="button" value=" 7 " onClick="enter(this.form, seven)"></td>
   <td><input type="button" value=" 8 " onClick="enter(this.form, eight)"></td>
   <td><input type="button" value=" 9 " onClick="enter(this.form, nine)"></td>
   <td><input type="button" value=" / " onClick="enter(this.form, divide)"></td>
   </tr>
   <tr align=center>
   <td><input type="button" value=" 4 " onClick="enter(this.form, four)"></td>
   <td><input type="button" value=" 5 " onClick="enter(this.form, five)"></td>
   <td><input type="button" value=" 6 " onClick="enter(this.form, six)"></td>
   <td><input type="button" value=" * " onClick="enter(this.form, multiply)"></td>
   </tr>
   <tr align=center>
   <td><input type="button" value=" 1 " onClick="enter(this.form, one)">
   <td><input type="button" value=" 2 " onClick="enter(this.form, two)">
   <td><input type="button" value=" 3 " onClick="enter(this.form, three)">
   <td><input type="button" value=" - " onClick="enter(this.form, minus)"></td>
   </tr>
   <tr align=center>
   <td colspan=2><input type="button" value=" 0 " onClick="enter(this.form, zero)">
   <td><input type="button" value=" . " onClick="enter(this.form, decimal)"></td>
   <td><input type="button" value=" + " onClick="enter(this.form, plus)"></td>
   </tr>
   <tr align=center>
   <td colspan=2><input type="button" value=" = " onClick="compute(this.form)"></td>
   <td colspan=2><input type="button" value=" AC " size= 3 onClick="calc.expr.value = ''"></td>
   </tr>
   </table>
   </form>
   </body>
   </html>
  38,Q:在网页上实现“预览图”:
     A:网页制做时,大的图片会消耗较长的下载时间,为了不使浏览者失去耐心,可以采用“预览图”(low source)的办法,即先下载一个“low source”,然后再下载真正需要显示的图片。在 Html 文档中标注“low source”的方法为:〈img src="需要显示的图片" lowsrc="预览图" width="x" height="y"〉(其中 width 和 height 是需要显示的图片的宽度和高度。如果不加 width 和 height 属性,浏览器视为以较小图片作为长宽尺寸。)
实现“预览图”还有一个方法,就是将预览图做成一个链接,如果用户愿意,可以点击它,再观看真正的图片,格式是:
<a href="需要显示的图片"><img src="预览图" width=x height=y border=0></a>
  39,Q:闪亮的链接:
     A:
     <a href="linkto" name="link1" style="text-decoration:underline;color:green;">闪亮的链接</a>
     <script language="JavaScript">
     <!-- 这段脚本放在链接的后面
     function flashit()
     {
     if (!document.all) return
     if (link1.style.color=="green")
       link1.style.color="red"
     else
       link1.style.color="green"
     }
     setInterval("flashit()", 400)
     //-->
     </script>
  40,Q:在网页中添加“添加到收藏夹”“设为首页”功能(似乎只能在 IE5.0 以上版本使用?):
     A:添加到收藏夹:〈a href="javascript:window.external.addFavorite('http://链接','说明');"〉添加到收藏夹〈/a〉
设为首页:〈a href=# onclick=this.style.behavior='url(#default#homepage)';this.setHomePage('http://链接');〉设为首页〈/a〉

启明星网络
相关文章
暂无相关文章!
最新评论

暂任何数据!
不能超过250字,请自觉遵守互联网相关政策法规。
昵称: 验 证 码: