|
|
 |
Novedades |
 |
 |
Dos nuevos artículos.
Instalación y uso de dos programas que pueden mejorar nuestra seguridad en internet. Sencillos, gratuitos y en castellano!
|
 |
|
También en puntocom.
A partir de hoy ya se puede acceder a esta página tanto con el .net como con el .com. Una puerta más para la misma casa.
|
|
 |
|
 |
|
|
|
| |
|
|
|
Dar color a las barras de Scroll |
|
|
Aunque es un efecto que solo puede verse en navegadores iExplorer de M$ y desde su versión 5.5 en adelante,
puede resultar interesante para dar un toque de color extra a la página o para conseguir algún que otro truco.
A veces un sitio tiene un marcado esquema de color y queremos mantenerlo o remarcarlo. Si el visitante tiene una versión
compatible de iExplorer (todavía, una inmensa mayoría) podemos extender esos colores distintivos a la barra de desplazamiento lateral o
scroll. También podemos hacerla desaparecer, aunque en realidad esté ahí. ¿Cómo? Con un simple truco de camuflage.
Supongamos que tenemos una página con un predominio de, digamos, azules oscuros (algo como Ecc-Cantabria.com)
y que, por alguna razón, queremos evitar que aparezcan las barras de desplazamiento. Ojo, no es una buena idea porque puede dificultar la navegación
por la página. Pero tenemos implementado nuestro propio sistema y nos "sobran" los las barras de desplazamiento del navegador. ¿Solución? Sencilla,
tomamos el color de fondo, el que predomine junto a la barra de desplazamiento, y se lo asignamos a todas las propiedades de estilo de esta que luego veremos.
Resultado: la barra desaparece mimetizada con el fondo de la página.
La forma de jugar con estos colores es usar estilos CSS. Los estilos CSS permiten cambiar muchas características de una página web, pero las más
conocidas son las de tipo y color de letra, efectos de texto en enlaces, etc. Este de los scrolls es un uso más. Las propiedades que vamos a tocar se refieren
al cuerpo de la página o BODY y son las que aparecen en la tabla inferior, junto con la parte de la barra a la que se refieren. Los valores que toman son
los de cualquier color válido, ya sea en hexadecimal o haciendo uso del nombre de color (en inglés y que sea reconocido)
| scrollbar-face-color: cara superior de la barra y el fondo. |
 |
scrollbar-highlight-color: sombra superior izquierda de la barra y fondo. |
 |
| scrollbar-3dlight-color: sombra superior izquierda de la barra. |
 |
scrollbar-darkshadow-color: sombra inferior derecha de la barra. |
 |
| scrollbar-shadow-color: otra sombra inferior derecha de la barra. Esta del volumen |
 |
scrollbar-arrow-color: Flechas de dirección. |
 |
| scrollbar-track-color: Color del "raíl" de desplazamiento. Esta del volumen |
 |
Esto es lo que tenemos a nuestra disposición y esta es la forma de escribirlo en nuestra página:
<html>
<head>
<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: #DFA93D;
scrollbar-highlight-color: #E0DFDF;
scrollbar-3dlight-color: white;
scrollbar-darkshadow-color: green;
scrollbar-shadow-color: green;
scrollbar-arrow-color: black;
scrollbar-track-color: #E0DFDF;
}
-->
</STYLE>
</head>
<body>
...
Si te fijas, es la misma declaración usada para esta página. Mismos colores, mezclando valores en hexadecimal y nombres de colores.
Para hacer desaparecer la barra por completo, podría haber asignado el color #E0DFDF a todas las propiedades. En cambio, si le quisieramos
dar un aspecto plano, sin volumen, asignamos el mismo color a estas cuatro propiedades: scrollbar-highlight-color, scrollbar-3dlight-color, scrollbar-darkshadow-color, scrollbar-shadow-color.
Si jugamos con estos valores, podemos darle un aspecto no plano, pero menos redondeado, más plano.
Las posibilidades son grandes, solo hay que ir probando colores, combinaciones, etc hasta dar con la que más nos agrada y la que mejor encaja
con la página. No hay que olvidar que este efecto solo se consigue en navegadores iExplorer a partir de la versión 5.5, así que no es bueno darle mucha importancia
en el diseño general de la página pues algunos visitantes podrían perder este elemento por usar navegadores como Mozilla o Netscape.
|
|
|
Webmaster - 24/04/2003 |
|
|
| |
|
