Lanzamiento de la web de Altec Management

Desde principios del pasado mes de abril 2010, Altec Management, una consultoría especializada en proporcionar servicios de gestión a pymes, tiene ya visible su página web.
Altec Management proporciona servicios avanzados en ámbitos tales como Consultoría estratégica y de operaciones, comercial, marketing, consultoría financiera, Tecnología, Calidad y Medio ambiente.
La página web ha sido desarrollada combinando elementos de html con hojas de estilo CSS, flash y php, y se ha priorizado la usabilidad ante todo, así como la posibilidad de incluir nuevas secciones.

El menú principal de navegación está basado en CSS: utiliza hojas de estilo configurables para modificar los aspectos visuales del menú, y todos los campos del menú son de texto plano, lo que permite añadir y modificar secciones de forma muy fácil y rápida.
Para la página de inicio, ARDITEC SISTEMAS ha desarrollado una animación flash que alterna imágenes del sector y, por último, la página de contacto utiliza un formulario basado en un script de php, que envía un mensaje a la cuenta de correo que se haya definido.
Menú dinámico desplegable css
A continuación se incluye el código css y javascript que se ha utilizado para habilitar un menú dinámico desplegable, que permita añadir o quitar secciones con sólo modificar texto.
menuheader_base.css
/*V2*/
body{margin:0;padding:0; text-align:left; background-color:#FFFFFF;}
#main{width:510px; /*define el ancho del menu*/
/*position:absolute;margin-left:-10px;left:10px; /* posición del nav */
text-align:left;}
#header{ width:100%;background:url(images/altec1_04.png) no-repeat;height:155px;}
/* ————- Menú de Navegación ————————– */
#nav{
margin:0;
position:relative;
top:60px;
left:80px;
/* left:540px; /*margen con el div */
}
#nav li{
color:#2c4959; /*color base del texto*/
float:left;
width:6em; /*anchura base de los términos del menu principal */
margin:0;
padding:0;
list-style:none;
background:transparent;
font:16px Century Gothic,Verdana,Tahoma,Helvetica,Sans-serif; /*fuente base de los términos del menu principal */
text-align:left;
position:relative;
cursor:default;
}
#nav li, ul{
padding:0px; /* referente a la parte superior */
margin:0;
/* margin: 0.5em 0; esto pondría separación vertical entre las cajas */
}
#nav a{
text-decoration:none;
padding: 0.3em; /* añade el margen a la izq en el texto de las cajas */
font-weight: bold;
}
#nav li a{
color: #2c4959;
}
#nav li a:hover{
color: #000000; /*color de los términos del menu principal cuando pasas el ratón por encima*/
}
#nav li li{
filter:Alpha(opacity=80,finishopacity=80,style=1);/* Transparencia en Internet Explorer */
left: -15px; /* desplaza 15px a la izquierda el menu desplegable */
font-weight: bold; /* IE 8 no lo tiene en cuenta, pero firefox sí */
/* padding:0 0 0 20px; /* desplazaría 20px a la derecha la caja */
}
#nav li li a{
color: #111111; /* color base menu desplegable */
display:block;
font-weight: bold;
border-style:solid; border-width:0px 1px 1px 1px; /* arriba, dcha, abajo, izqda */
font:12px Verdana,Century Gothic,Tahoma,Helvetica,Sans-serif;
background:transparent url(nav.png) 0px 0px repeat scroll; /* fondo del texto sin seleccionar */
line-height:22px;
}
#nav li li a:hover{
color:#000000; /*color de los términos del menu desplegable cuando pasas el ratón por encima*/
background:transparent url(navhover.png) 0px 0px repeat scroll;/* Transparencia en Otros navegadores */ /* fondo del texto seleccionado */
}
li ul{
display:none;position:absolute;top:100%;left:0;
}
li>ul{
top:auto;
}
li li{
float:left;
border:0;
display:block;
background:transparent;
}
li:hover ul,li.over ul{display:block;}
menuheader.js
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById(“nav”);
for (i=0; i

<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName==”LI”) {
node.onmouseover=function() {
this.className+=” over”;
}
node.onmouseout=function() {
this.className=this.className.replace(” over”, “”);
}
}
}
}
}
window.onload=startList;
y el código html que va incluido en la web:
<div id=”main”>
<div id=”header”>
<ul id=”nav”>
<li> <a href=”index.html”>Inicio</a> </li>
<li> <a href=”empresa_presentacion.html”>Empresa</a>
<ul>
<li style=”width:7em;”><a href=”empresa_presentacion.html”>Presentacion</a></li>
</ul>
</li>
<li><a href=”servicios_consultoria.html”>Servicios</a>
<ul>
<li style=”width:14em;” ><a href=”servicios_consultoria.html”>Consultoria
Estrategica y de Operaciones</a></li>
<li style=”width:14em;”><a href=”servicios_comercial.html”>Comercial
y Marketing</a></li>
<li style=”width:14em;”><a href=”servicios_financiera.html”>Consultoria
Financiera</a></li>
<li style=”width:14em;”><a href=”servicios_tecnologia.html”>Tecnologia
– IT</a></li>
<li style=”width:14em;”><a href=”servicios_calidad.html”>Calidad
y Medio Ambiente</a></li>
</ul>
</li>
<li><a href=”contacto.php”>Contacto</a></a> </li>
</ul>
</div>
</div>

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies