中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

【ColorTrans顏色漸變】

有了顏色梯度集合，只需要設個定時器把集合的值依次顯示就是一個漸變效果了。
這個漸變有兩種效果：顏色漸入（transIn）和顏色漸出（transOut）。
原理就是通過改變_index集合索引屬性，漸入時逐漸變大，漸出時逐漸變�。�

  transIn: function() {
    this.stop(); this._index++; this._set();
    if(this._index < this._colors.length - 1){
        this._timer = setTimeout($$F.bind( this.transIn, this ), this.speed);
    }
  },
  transOut: function() {
    this.stop(); this._index--; this._set();
    if(this._index > 0){
        this._timer = setTimeout($$F.bind( this.transOut, this ), this.speed);
    }
  },

在_set設置樣式程序中修改樣式：

var color = this._colors[Math.min(Math.max(0, this._index), this._colors.length - 1)];
this._elem.style[this.style] = "rgb(" + color.join(",") + ")";

其中style屬性是要修改的樣式屬性名，例如顏色是"color"，背景色是"backgroundColor"。

由于顏色集合是根據(jù)開始顏色、結束顏色和步數(shù)生成的，所以如果要修改這些屬性必須重新生成過集合。

reset程序就是用來重新生成集合的，同時索引也會設回0：

this._options = options = $$.extend(this._options, options || {});
this._colors = ColorGrads( [options.from, options.to], options.step );
this._index = 0;

程序初始化的時候也會reset一次：

this.reset({
    from: this.options.from || $$D.getStyle(this._elem, this.style),
    to: this.options.to,
    step: Math.abs(this.options.step)
});

如果沒有自定義from顏色的話會自動獲取當前顏色。

出處：藍色理想
責任編輯：bluehearts

上一頁 JavaScript顏色梯度和漸變效果改進 [3] 下一頁 JavaScript顏色梯度和漸變效果改進 [5]

◎進入論壇網(wǎng)頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。