script.aculo.us 不透明度效果

script.aculo.us不透明度效果是核心效果之一，它允许我们逐渐将元素的不透明度更改为给定级别。此效果以元素的当前不透明度开始，除非定义了 'from' 选项，并以由 'to' 选项定义的不透明度结束，默认不透明度值为 1.0。

句法：

new Effect.Opacity('id_of_element', [options]);

示例 1：此示例显示如何将不透明度更改为显示或隐藏内容。

HTML

  

    
    
      
    
    
      
    
        function ShowElement(element) {
            new Effect.Opacity(element, { 
                duration: 1, from: 0, to: 1.0 });
        }
  
        function HideElement(element) {
            new Effect.Opacity(element, { 
                duration: 1, from: 1.0, to: 0 });
        }
    

  

    
        Show Content
    
    
  
    
        Hide Content
    
    
    

  

输出：

示例 2：更改内容的不透明度。

HTML

  

    
    
      
    
    
      
    
        function ShowElement(element) {
            new Effect.Opacity(element, { 
                duration: 1.5, from: 0.5, to: 1.0 });
        }
  
        function HideElement(element) {
            new Effect.Opacity(element, { 
                duration: 1.5, from: 1.0, to: 0.3 });
        }
    

  

    
        Show Content
    
    
  
    
        Fade Content
    
    
    

  

输出：