Tengo el siguiente codigo no consigo hacer un scrollTop cuando el mouse pasa (verticalmente) por el contenedor que asocie.
Vamos por partes.
JQUERY
Código:
$('#ultimosTitulares').bind('mouseover', function(e) {
$(this).data('ultimosTitulares', {
element: this,
scroll: this.scrollTop,
y : e.clientY
}).bind('mousemove.slider', function(e) {
var data = $(this).data('ultimosTitulares');
data.element.scrollTop = (data.y + e.clientY - data.scroll);
}).bind('mouseup.slider', function(e) {
$(this)
.removeData('ultimosTitulares')
.unbind('.slider');
});
e.preventDefault();
});
HTML
Código PHP:
<div style="float:left; clear:right; width:auto; display:inline; margin:0 10px 0 0;">
<div class="encabezadoCentral" style="overflow: hidden; height: 296px;">
<h2>Ultimos titulares</h2>
<div id="ultimosTitulares">
<ul class="slider" style="height:580px;">
<?php
for($i=0; $ultimoTitular = mysql_fetch_object($ultimosTitulares); $i++){
?>
<li><a href="entradas-<?php echo($ultimoTitular->volanta_url); ?>-<?php echo($ultimoTitular->titulo_url); ?>" title="<?php echo(stripslashes($ultimoTitular->volanta).' - '.stripslashes($ultimoTitular->titulo)); ?>"><?php echo(stripslashes($ultimoTitular->titulo)); ?></a></li>
<?php
}
?>
</ul>
</div>
</div>
</div> CSS
Código:
#ultimosTitulares{
width: 230px;
overflow: auto;
padding:5px 0;
background-color:#fff;
border-top:#ccc 1px solid;
border-bottom:#ccc 1px solid;
float:left;
clear:both;
}
#ultimosTitulares ul.slider{
height: 580px;
margin: 0;
padding: 0;
}
#ultimosTitulares ul.slider li{
display: block;
padding: 0;
margin: 0;
float: left;
clear:both;
}
Desde ya muchas gracias por su tiempo
