Este código tem nota
8
Versão para Impressão
Enviar por E-mail
Adicionar em Favoritos
Assine nossos Feeds

Conheça o Autor

chinela0
andré luiz
martins ramos
membro deste março de 2007.

Palavras-Chave

CSS
Efeitos
IE
JavaScript

Leia mais

Adobe After Effects 6.5: Efeitos Mágicos
Compartilhe e guarde
  • Rec6
  • StumbleUpon
  • ueba
  • linkk
  • dihitt
  • linkloko
  • websapiens
  • linkto
  • Technorati
  • Simpy
  • del.icio.us
  • Faves: Fave It!
JavaScript - DHTML / Browser

Trocar cores da barra de rolagem com JavaScript

visto por 3640 vez(es)

Com este script é muito simples criar um efeito do tipo "OnMouseOver" porém na Barra de Rolagem (ScrollBar) do Internet Explorer.

O código é muito prático para customizar, porém só funcionará no IE 5.5 ou superior.
Copiar o Código para a Área de Transferência
Aumentar fonte
Diminuir fonte
Aumentar a altura da caixa de código
Diminuir a altura da caixa de código
Visualizar código em modo de edição
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Scroll Bar</title>
</head>

<body>
<script language=javascript>
/*---------------[IE 5.5 Scrollbars colorer]--------------------*/
function scrollBar(line,face,theme){
	if (!line||!face){
		line=null;
		face=null;
		switch(theme){ // Predefined themes
			case "blue":
				var line="#000000";
				var face="#EBF5FF";
				break;
			case "orange":
				var line="#78AAFF";
				var face="#EBF5FF";
				break;
			case "red":
				var line="#FF7979";
				var face="#FFE3DD";
				break;
			case "green":
				var line="#00C600";
				var face="#D1EED0";
				break;
			case "neo":
				var line="#000000";
				var face="#DEDFE2";
				break;
		}
	}

	with(document.body.style){
		scrollbarDarkShadowColor=line;
		scrollbar3dLightColor=line;
		scrollbarArrowColor="black";
		scrollbarBaseColor=face;
		scrollbarFaceColor=face;
		scrollbarHighlightColor=face;
		scrollbarShadowColor=face;
		scrollbarTrackColor="#999999";
		}
}

/*------------------[Pointer coordinates catcher]---------------*/
function colorBar(){
	var w = document.body.clientWidth;
	var h = document.body.clientHeight;
	var x = event.clientX;
	var y = event.clientY;
	if(x>w) scrollBar('#000000','#B4B3B3'); // Your colors
	else scrollBar(null,null,"neo"); // A predefined theme
}

if (document.all){
	scrollBar(null,null,"neo");
	document.onmousemove=colorBar;
}
//-->
</script>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

</body>
</html>

Sim   Não   Este código foi útil para você?
NotaComentárioMembro
8
21/11/2007
Fácil
Bom código
 adgonzaga
Regras:
Os comentários seguem as seguintes regras:
  • Todos os comentários são enviados por membros cadastrados no site.
  • Os comentários serão pré-aprovados, porém a equipe do site revisará o conteúdo de todos os comentários podendo ser invalidados (inclusive a pontuação).
  • Os comentários precisam ter, obrigatóriamente, coerência sobre o conteúdo que será comentado.
  • O membro que atingir 10 comentários invalidados não poderá mais comentar dentro do site. Com isso o membro não poderá mais ganhar pontos com comentários.