利用遞增的數(shù)字返回循環(huán)漸變的顏色的js代碼
更新時(shí)間：2008年10月22日 02:29:37 作者：
其實(shí)很久前就想寫一個(gè)這樣的函數(shù)了。因?yàn)楹芏鄷r(shí)候需要利用遞增數(shù)字返回一個(gè)漸變顏色序列，今天終于完成了。
函數(shù)如下：
function gCL(i){
var f=parseInt((i%15)/5);
i=i%15%5;
switch(f){
case 0:return "#"+cS2(255-i*51)+cS2(i*51)+"00";
case 1:return "#00"+cS2(255-i*51)+cS2(i*51);
case 2:return "#"+cS2(i*51)+"00"+cS2(255-i*51);
}
}
function cS2(i) {
var s=i.toString(16);
return ("00"+s).substr(s.length);
}
使用gCL就可以利用遞增的數(shù)字返回由紅到綠到藍(lán)的漸變顏色了。漸變效果如下，共15種顏色，循環(huán)漸變：
比如下面的應(yīng)用，使用這個(gè)函數(shù)可以將超級(jí)鏈接的背景色進(jìn)行漸變：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
這個(gè)函數(shù)加以修改還可以產(chǎn)生更加細(xì)致的顏色變化，有興趣的朋友可以試試。
復(fù)制代碼 代碼如下:
function gCL(i){
var f=parseInt((i%15)/5);
i=i%15%5;
switch(f){
case 0:return "#"+cS2(255-i*51)+cS2(i*51)+"00";
case 1:return "#00"+cS2(255-i*51)+cS2(i*51);
case 2:return "#"+cS2(i*51)+"00"+cS2(255-i*51);
}
}
function cS2(i) {
var s=i.toString(16);
return ("00"+s).substr(s.length);
}
使用gCL就可以利用遞增的數(shù)字返回由紅到綠到藍(lán)的漸變顏色了。漸變效果如下，共15種顏色，循環(huán)漸變：
比如下面的應(yīng)用，使用這個(gè)函數(shù)可以將超級(jí)鏈接的背景色進(jìn)行漸變：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
這個(gè)函數(shù)加以修改還可以產(chǎn)生更加細(xì)致的顏色變化，有興趣的朋友可以試試。
相關(guān)文章
這篇文章主要介紹了判斷文件是否正在被使用的JS代碼，有需要的朋友可以參考一下2013-12-12
js找出5個(gè)數(shù)中最大的一個(gè)數(shù)和倒數(shù)第二大的數(shù)實(shí)現(xiàn)方法示例小結(jié)
這篇文章主要介紹了js找出5個(gè)數(shù)中最大的一個(gè)數(shù)和倒數(shù)第二大的數(shù)實(shí)現(xiàn)方法,結(jié)合實(shí)例形式總結(jié)分析了JavaScript數(shù)組遍歷、排序、判斷、比較等相關(guān)操作技巧,需要的朋友可以參考下2020-03-03
使用javascript:將其它類型值轉(zhuǎn)換成布爾類型值的解決方法詳解
本篇文章是對(duì)使用javascript:將其它類型值轉(zhuǎn)換成布爾類型值的解決方法進(jìn)行了詳細(xì)的分析介紹。需要的朋友參考下2013-05-05
uniapp基礎(chǔ)篇之上傳圖片的實(shí)戰(zhàn)步驟
應(yīng)用uni-app開發(fā)跨平臺(tái)App項(xiàng)目時(shí),上傳圖片、文檔等資源功能需求十分常見,下面這篇文章主要給大家介紹了關(guān)于uniapp基礎(chǔ)篇之上傳圖片的相關(guān)資料,需要的朋友可以參考下2022-12-12
給Flash加一個(gè)超鏈接(推薦使用透明層)兼容主流瀏覽器
給一個(gè)Flash加一個(gè)超鏈接,原想直接在object外直接套一個(gè)超鏈接即可，試了之后卻發(fā)現(xiàn)不是這么回事2013-06-06
微信小程序picker組件兩列關(guān)聯(lián)使用方式
這篇文章主要介紹了微信小程序picker組件兩列關(guān)聯(lián)使用方式,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-10-10
JavaScript彈出新窗口后向父窗口輸出內(nèi)容的方法
這篇文章主要介紹了JavaScript彈出新窗口后向父窗口輸出內(nèi)容的方法,涉及javascript窗口操作的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-04-04
別人寫的 js 格式代碼,說(shuō)是不會(huì)死機(jī),可以格式超長(zhǎng)代碼.2008-05-05
這篇文章主要介紹了js 二進(jìn)制流轉(zhuǎn)圖片的操作方法,接收數(shù)據(jù)大家需要注意,如果后端的接口是get方法,可以直接使用img標(biāo)簽,本文通過(guò)示例代碼講解的非常詳細(xì),需要的朋友參考下吧2023-12-12
Javascript?中AJAX的圖書管理代碼實(shí)例詳解
這篇文章主要為大家詳細(xì)介紹了AJAX的圖書管理代碼實(shí)例，使用數(shù)據(jù)庫(kù)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-02-02