Les cuento, resulta que estoy realizando una web para darme publicidad y ganarme la vida en estos tiempos de crisis... supongo que muchos de vosotros me entendereis.. :P
el site lo tengo hospeado en miarroba como sitio de pruebas, y es el siguiente: http://syszer0.webcindario.com
y bueno, antes de nada voy a dejarles todo claro para evitar perdidas de tiempo.
La web está programada en css, html, php y javascript.
El efecto de los menús lo consigo gracias a los módulos que me ofrece la librería de jquery, así como los botones de navegación situado a la izquierda que aquí es donde tengo mis problemas....
Resulta que conseguí mediante el módulo de jquery scrollable, crear esos "bonitos" botones de navegación, pero debido a mi baja experiencia en javascript, (y seguro que lo que pido es una tontería) no sé como aplicarle un efecto de "onmouseover" y "onmouseout" a esos botones usando esos modulos mencionados anteriormente.
Les muestro el código de la css, de la página y del script encargado de hacer la función de scrollbar:
css:
Código:
.butons {
position: absolute;
top: 360px;
left: 250px;
}
a.browse {
position: relative;
display: block;
width: 30px;
height: 30px;
margin: 40px 10px;
cursor: pointer;
}
a.up, a.down {
background: url(../images/vert_large.png) no-repeat;
margin: 10px 50px;
}
a.up:hover { background-position: -30px 0px; }
a.up:active { background-position: -60px 0px; }
a.down { background-position: 0px -30px; }
a.down:hover { background-position: -30px -30px; }
a.down:active { background-position: -60px -30px; }
a.disabled {
visibility: hidden;
}
.scrollable {
position: relative;
overflow: hidden;
height: 260px;
width: 640px;
}
.scrollable .items {
position: relative;
}
caja en la página donde aperecen los botones (con un amago de funcion onmouseover xD):
Código:
<DIV CLASS="butons"> <A CLASS="prev browse up disabled" onmouseover="function()"></A> <A CLASS="next browse down disabled" onmouseover="function()"></A> </DIV>
js que hace la función del scrollbar (obviamente cargando anteriormente jquery.js):
Código:
como pueden ver al pulsar los botones en la web todo funciona perfectamente, baja el contenido de la caja y sube según clickeas los botones (enlaces en este caso).$(function() {
$(".scrollable").scrollable({ vertical: true, mousewheel: true, speed: 400});
});
Ahora viene la duda:
1 - Me gustaría que al pasar el ratón por encima de esos botones, también siguiera haciendo ese efecto de subir y bajar el contenido de la caja sin necesidad de tener que pulsarlos y usar ese recurso como 2ª opción.
Seguro que es algo sencillito pero mi ignorancia y mi desconocimiento de js supongo ke me limita diariamente y no me deja pasar de ahí xD.
2 - Ya de paso si saben de algún hosting gratuito que vaya más fluido que miarroba me sería un grato placer ya que como también pueden comprobar la web tarda 300 años en cargar.
Espero que puedan ayudarme, disculpen por las molestias, y a su vez espero alguna respuesta que me pueda servir, nuevamente muchísimas gracias y Salu2
