What do you want to do in the navigation bar of this site. Therefore, I chose to use js to perform Gradient Changes on the color of the navigation bar.
At first, I thought that the opacity attribute (transparency) was used to change the gradient of the color. However, this will cause a problem.
Each navigation label uses [li]. When the mouse moves to the label, the className of [li] is changed through onmouseover () and setInterval () is used () to change its opacity (transparency) from 0 to 1. however, when the mouse leaves, it seems a lot of trouble to restore the color of the [li] label. Therefore, I quickly gave up this practice and changed my mind.
To Baidu on a search, saw a good article, address for http://www.cnblogs.com/cloudgamer/archive/
2009/03/11/color.html. Then, the solution is simplified and found.
It is better to first use two color values, such as "# FFFFFF" and "# CCCCCC", one of which is the starting color and the other is the ending color. After processing, obtain the various color strings of the two colors when they change, and the number of strings, that is, the acquisition frequency can be adjusted. The Code returned to an array variable is as follows:
Copy codeThe Code is as follows:
/**
* @ Desc this file is the library for changing the color gradient-colorGrad. js
* @ Author GenialX
* @ Date 2013.05.30
* @ QQ 2252065614
* @ URL http://www.ihuxu.com
*/
/**
* Function for changing colors
* BeginColor/endColor are hexadecimal strings in the form of # FFFFFF. The rate is the gradient speed.
* @ Return colorArray array is like # FFFFFF String Array
* Call format changeColor ("# FFFFFF", "#000000", 100 );
*/
Function getColorArray (bColor, eColor, r ){
// The color value in the transition, for example, # FFFFFF
Var curColor = new Object ();
Var beginColor = new Object ();
Var endColor = new Object ();
Var rate = new Object ();
// Obtain the growth direction of each rgb. True indicates increase, and false indicates decrease.
Var isTrue = new Object ();
Var colorArray = new Array ();
Var I = 0; // array subscript
BeginColor = getRGB (bColor); // change to the ogj type.
EndColor = getRGB (eColor); // change to the ogj type.
CurColor = getRGB (bColor );
Rate = getRate (beginColor, endColor, r );
IsTrue = getIsTrue (beginColor, endColor)