Effet de surbrillance en javascript

Télécharger le projet
Commenter

Description

Bonjour, voici un effet très sympa à réaliser pour vos menu, ou tout autre chose selon votre imagination.
Il sagit d'un effet de transition de couleur de fond des cadres (Div ou autre) entierement fait en Javascript, marche sur tout les navigateurs

Source / Exemple : 


function getReferenceToDiv(divId,oDoc)
{
	if(document.getElementById)
		{return document.getElementById(divId);}
	if(document.all)
		{return document.all[divId];}
	if(!oDoc)
		{oDoc = document;}
	if(document.layers)
		{
		if(oDoc.layers[divId])
			{return oDoc.layers[divId];}
		else{
			for( var x = 0, y; !y && x < oDoc.layers.length; x++)
				{
					y = getReferenceToDiv(divId,oDov.layers[x].document);
					return y;
				}
			}
		}
	return false;
}

function bgColor(myReference,Hexcolor){
if( myReference.style ) { myReference = myReference.style; }
Hexcolor = "#"+Hexcolor;
  myReference.background = Hexcolor;
  myReference.backgroundColor = Hexcolor;
  myReference.bgColor = Hexcolor;
}

function cutHex(h){return (h.charAt(0)=="#") ? h.substring(1,7) : h;}
function RtoH(n){if(n==null){return "00";}
	var hexa="0123456789ABCDEF";
	if(n==null){return "00";}
	n=parseInt(n);if(n==0 || n==null){return "00";}
	n=Math.max(0,n); n=Math.min(n,255);n=Math.round(n);
	return hexa.charAt(Math.floor(n/16)) + hexa.charAt(n%16);}
	
function degradee(ref,Hex1,Hex2,Percent){
var rgb1=new Array();
rgb1[0] = parseInt((cutHex(Hex1)).substring(0,2),16);
rgb1[1] = parseInt((cutHex(Hex1)).substring(2,4),16);
rgb1[2] = parseInt((cutHex(Hex1)).substring(4,6),16);

var rgb2=new Array();
rgb2[0] = parseInt((cutHex(Hex2)).substring(0,2),16);
rgb2[1] = parseInt((cutHex(Hex2)).substring(2,4),16);
rgb2[2] = parseInt((cutHex(Hex2)).substring(4,6),16);
var dr = rgb1[0]-(Percent*(rgb1[0] - rgb2[0])) / 100;
var dg = rgb1[1]-(Percent*(rgb1[1] - rgb2[1])) / 100;
var db = rgb1[2]-(Percent*(rgb1[2] - rgb2[2])) / 100;

var color = RtoH(dr)+RtoH(dg)+RtoH(db);
bgColor(ref,color);

}

function surbrillance(id,millisec,HexInit,HexFinal){
	var obj = getReferenceToDiv(id);
	var timer=0;
	var speed = Math.round(millisec / 100);
	var o = 0;
	for(var a=0;a<100;a++){
		setTimeout(function(){degradee(obj,HexInit,HexFinal,o);o++;},(timer*speed));timer++;
	}
}

Conclusion :


on retrouve les classiques convertisseurs Hex to RGB et vice versa .
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (zulrigh)