Chinaunix首页 | 论坛 | 博客
  • 博客访问: 199346
  • 博文数量: 163
  • 博客积分: 4010
  • 博客等级: 上校
  • 技术积分: 1720
  • 用 户 组: 普通用户
  • 注册时间: 2009-06-08 11:41
文章分类

全部博文(163)

文章存档

2011年(1)

2009年(162)

我的朋友

分类:

2009-07-07 18:30:36

Quicktime电影就有海报帧的思想。电影中的一帧(经常就是其中的第一帧)将会放到该电影出现的地方。当用户点击海报帧时,实现的电影才会通过网络被加载进来。这就能极大地加快该电影所在Web页面的加载速度。使用少许JavaScript,完全可以为Java 实现相同的功能。

  Applet的海报帧

  在研究这个之前,我必须要提到,我个人尚未在IE浏览器中测试过这个Demo。如果你发现这个Demo不能在某个浏览器中运行,请向错误信息发送给我,以便我能更新这个JavaScript。

  基本思想非常的简单,创建一个div,它包含一个链接和一张屏幕截图。当用户点击该链接时,我们使用一个新的applet元素去替换页面中的a和img元素。一旦浏览器察觉到了这个新的applet元素,它将下载Java插件并启动这个Applet。

  这就有一个例子:如果你点击了这张图片,一个Applet就会被加载到该图片所在的位置,并会说"applet loaded"。

  JavaScript

  如下就是这个JavaScript脚本:


<>
function generateInlineAppletTag(appletID, screenshotID) {
  var attributes = {
    :'animatedstartup.MainApplet',
    width:100,
    height:100,
    :'',
    id:'fooApplet'
  };
  var parameters = {
    image:'',
    centerImage:'true'
  };
  
  
  var appletTag = document.createElement("applet");
  
  for (var in attributes) {
    appletTag.setAttribute(attribute,attributes[attribute]);
  }
  
  if (parameters != '#ff0000' && parameters != null) {
    for (var in parameters) {
      var param = document.createElement("PARAM");
      param.setAttribute("name",parameter);
      param.setAttribute("value",parameters[parameter]);
      appletTag.appendChild(param);
    }
  }
  
  
  var bodyRef = document.getElementById(appletID);
  var screenshot = document.getElementById(screenshotID);
  bodyRef.removeChild(screenshot);
  bodyRef.appendChild(appletTag);
}

  该脚本的第一部分初始化了两个哈希表,它们包含了applet元素的属性与嵌套的param标签。然后,它会使用 document.createElement()方法去创建这个applet,并配置其中的属性与PARAM元素。到目前为止,还很直接。真正地奇妙之 事发生在generateInlineAppletTag函数的最后四行。它使用传入的appletID参数与包含着上述链接与图片的div元素相联在一 起,然后它会找到并删除该链接,而用新的applet元素去替代这个链接。

  HTML

  要使用上述javascript函数,你只需将它放到页面的顶部,并通过那张屏幕截图链接的href去调用它。在本例中,我使用了:

  


     这个div被命名为appletDiv,链接被命名为screenshot1。该链接的href会调用上述javascript函数,并传入div与链接 的名称。最后该图片就只是显示将要运行的Applet的一张屏幕截图,该图被一个播放按钮覆盖着。就这么简单,在这里你可以看到完整的 javascript和HTML语句。

  结论

  这个javascript只是一个开始。你还能很容易的扩展它,使图片上能展现关于这个Applet的更多信息。你也可以把这个javascript重写为一个更加可重用的形式,使它能够被你的整个站点所共享。

  下次我将向你展示如何使用新的发布工具包去侦测当前已安装的Java版本,并启动更新程序。

阅读(479) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~