WEB开发网
开发学院网页设计JavaScript JavaScript 中的有限状态机,第 3 部分: 测试小部... 阅读

JavaScript 中的有限状态机,第 3 部分: 测试小部件

 2010-09-14 13:20:44 来源:WEB开发网   
核心提示: 当淡化工具提示的淡化效果不起作用时不幸的是,在用前一节中的设计修改消除关于意外事件的所有警告之后,JavaScript 中的有限状态机,第 3 部分: 测试小部件(8),对 Internet Explorer 的进一步测试发现了另一个无关的问题,用 FadingTooltip 部件定义的工

当淡化工具提示的淡化效果不起作用时

不幸的是,在用前一节中的设计修改消除关于意外事件的所有警告之后,对 Internet Explorer 的进一步测试发现了另一个无关的问题。用 FadingTooltip 部件定义的工具提示会直接弹入和弹出视图,而不是淡入和淡出。不幸的是,Internet Explorer 不支持提议的标准 CSS opacity 样式(参见 参考资料)。

Internet Explorer 支持非标准的样式 filter,这个属性具有相似的功能(参见 参考资料)。为了应用这个属性,需要在 createTooltip 方法中插入清单 7 中粗体的代码行。

清单 7. 在 Internet Explorer 中创建工具提示的额外 JavaScript 代码

FadingTooltip.prototype = {
  ...
  createTooltip: function() { 
  this.tooltipDivision = document.createElement('div');
    ... 
    this.currentOpacity = this.tooltipDivision.style.opacity = 0;
    if (this.tooltipDivision.filters) { // for MSIE only
        this.tooltipDivision.style.filter = 'alpha(opacity=0)';
        }
    ...
  },  
  ...

还需要在 fadeTooltip 方法中插入对应的代码,如清单 8 所示。

清单 8. 在 Internet Explorer 中使工具提示产生淡化效果的额外 JavaScript 代码

FadingTooltip.prototype = {
  ...
  fadeTooltip: function(opacityDelta) {
    ...
    this.tooltipDivision.style.opacity = this.currentOpacity;
    if (this.tooltipDivision.filters) { // for MSIE only
        this.tooltipDivision.filters.item('alpha').opacity =
        100*this.currentOpacity;
        }
  },  
  ...

上一页  3 4 5 6 7 8 9 10  下一页

Tags:JavaScript 有限 状态

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接