jaja .. igual si pones la ruta en google y le das a traducir esta página sale bastante claro :P
Aunque como digo ... el HTA en si consta de unas pocas etiquetas, el resto es HTML y scripting
Saludos
Ya osea, puedo hacer un html cualquiera e incluirle el vbscript con el HTA ::)
Gracias =)
Saludos.
En principio si, siempre y cuando le des extensión HTA, si lo haces con HTML tendras restricciones de seguridad.
http://www.microsoft.com/technet/scriptcenter/topics/htas/tutorial1.mspx
http://www.microsoft.com/technet/scriptcenter/topics/htas/tutorial2.mspx
http://www.microsoft.com/technet/scriptcenter/topics/htas/gradient.mspx
http://www.microsoft.com/downloads/details.aspx?FamilyId=231D8143-F21B-4707-B583-AE7B9152E6D9&displaylang=en
Bueno solo puedo decir que el HTA le ha dado nueva vida a mis archivos BAT, milagro........... Ahora lucen bastante bien, puesto que puedo direccionar la salida del los bats a un archivo y presentarla mediante las etiquetas <span>, <pre>, o formatar la salida como una tabla de HTML.
Sensei Novlucker, tiene razón la mayoria de las cosas deben hacerse con funciones creadas por nosotros, la ventaja es que mediante VBScript podemos ejecutar casi cualquier codigo BAT, JAVA, archivos ejecutables EXE. etc
Lo malo es que el HTA todavía no es compatible con las CSS, y hay que hacer los menus mediante javascript.
Saludos.
Antes que nada cito la fuente.
http://araudi.net/Desplegables/menu_desplegable4.html#
Hay problemas cuando se utiliza la pseudo clas HOVER, en este caso funciona porque el menú se activa mediante un click(). Cuando se trata de pasar el cursor por encima del menu los demas ejemplos no funcionan.
Vi el código fuente con Firefox, lo copie con extensión HTA, luego me metí al enlace del archivo CSS (menu-4.css), lo guarde, en el archivo HTA hay que modificar la ruta dejarla solo con el nombre del archivo css, o crear un directorio con el nombre de la ruta y meter el archivo css dentro. Con el IE no se si permite el acceso al archivo CSS
La otra forma de utilizar menus desplegables es mediante Java Script.
ARCHIVO HTA solo lo remombre, no tiene la cabecera de HTA, pero funciona. Tu mismo puedes arreglar este detalle.
----------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
<head>
<title>Menus desplegable solo CSS ejemplo 4 - Recursos CSS - araudi.net</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Keywords" content="recursos, css, diseño web, xhtml, software libre" />
<meta name="Description" content="Pagina dedicada a recursos de diseño web con CSS, en castellano" />
<meta name="Author" content="Mikel Morote Donazar - Praxis Iruñea SLL" />
<meta name="Subject" content="Recursos CSS" />
<meta name="Language" content="español" />
<meta name="Robots" content="index, follow" />
<link rel="alternate" href="http://www.araudi.net/indice.html" title="Indice de contenidos" media="all" lang="es" />
<link rel="stylesheet" href="menu-4.css" type="text/css" />
<style type="text/css">
#menu ul li:focus ul, #menu ul li:active ul {display: block;
position: absolute;width: 816px;border: solid 1px #fff;border-top: none;background-color: #6CC;}
#menu ul li:focus span, #menu ul li:active span {background-color: #6CC;border-bottom: solid 1px #6CC;color: #000;}
</style>
<!--[if IE]><style>#menu ul li span.nivel1 {display: none;}</style><![endif]-->
</head>
<body>
<div id="menu">
<ul>
<li class="nivel1" tabindex="1"><span class="nivel1">Opción 1</span>
<!--[if IE]><a href="#" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->
<ul class="uno">
<li><a href="http://www.google.es">Opción 1.1</a></li>
<li><a href="#">Opción 1.2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1" tabindex="2"><span class="nivel1">Opción 2</span>
<!--[if IE]><a href="#" class="nivel1ie">Opción 2<table class="falsa"><tr><td><![endif]-->
<ul class="dos">
<li><a href="#">Opción 2.1</a></li>
<li><a href="http://www.google.es">Opción 2.2</a></li>
<li><a href="#">Opción 2.3</a></li>
<li><a href="#">Opción 2.4</a></li>
<li><a href="#">Opción 2.5</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1" tabindex="3"><span class="nivel1">Opción 3</span>
<!--[if IE]><a href="#" class="nivel1ie">Opción 3<table class="falsa"><tr><td><![endif]-->
<ul class="tres">
<li><a href="#"></a></li>
<li><a href="http://www.google.es">Opción 3.1</a></li>
<li><a href="#">Opción 3.2</a></li>
<li><a href="#">Opción 3.3</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1" tabindex="4"><span class="nivel1">Opción 4</span>
<!--[if IE]><a href="#" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->
<ul class="cuatro">
<li><a href="#"></a></li>
<li><a href="#">Opción 4.1</a></li>
<li><a href="#">Opción 4.2</a></li>
<li><a href="#">Opción 4.3</a></li>
<li><a href="#">Opción 4.4</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1" tabindex="5"><span class="nivel1">Opción 5</span>
<!--[if IE]><a href="#" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->
<ul class="cinco">
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#">Opción 5.1</a></li>
<li><a href="#">Opción 5.2</a></li>
<li><a href="#">Opción 5.3</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
</body>
</html>
ARCHIVO CSS menu-4.css
Colocar en el mismo folder ó directorio
----------------------------------------------
* { margin: 0px;
padding: 0px; outline: 0;
}
html, body { width: 100%;}
body { background: #366;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu { text-align: center;
font-size: 0.7em;
width: 820px;
margin: 20px auto;
position: relative;
}
#menu ul { list-style-type: none;}
#menu ul li.nivel1 { float: left;
width: 162px;
margin-right: 2px;
position: relative;
}
#menu ul li { float: left;}
#menu ul li a, #menu ul li span {display: block;
text-decoration: none;
color: #fff;
background-color: #399;
border: solid 1px #fff;
padding: 8px;
position: relative;
}
a:active {position: relative;
}
#menu ul li a:active {background-color: #6CC;
color: #000;
border-bottom: solid 1px #6CC;
position: relative;
}
#menu ul li span.nivel1 {display: block;
}
#menu ul li:hover span.nivel1 {cursor: pointer;
}
#menu ul li ul {display: none;
}
#menu ul li a:hover ul, #menu ul li a:active ul {display: block;
position: absolute;width: 816px;border: solid 1px #fff;border-top: none;background-color: #6CC;
}
#menu ul li a:hover:link ul {visibility: hidden;
}
#menu ul li a:active:hover ul {visibility: visible;
}
#menu ul li ul li a {width: 160px;
padding: 6px 0px 8px 0px;
border: none;
background-color: #6CC;
font-weight: normal;
}
#menu ul li ul li a:hover {
position: relative;
text-decoration: underline;
border-bottom: none;
color: #000;
}
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
ul.uno {left: -0px;}
ul.dos {left: -164px;}
ul.tres {left: -328px;}
ul.cuatro {left: -492px;}
ul.cinco {left: -656px;}
Y funciona de maravilla.
Como inserto una imagen en los post del FORO?