Hola, mira esto fue lo que hice:
Pero hay una falla se me queda pegado el color amarillo, que me recomendarías?
asi quedó:
http://jofret.com/JQUERY/nueva.php Código HTML:
<style>
.deFecto{
height:100px;
width:100px;
background:blue;
color:black;
padding:30px;
}
.deFecto:hover{
cursor:pointer;
}
.efecto{
width:100px;
background:yellow;
color:white;}
</style>
<script type='text/javascript' src='js/jquery.js'></script>
<script type='text/javascript'>
$(document).ready(function(){
$('button').on('mouseover',function(event){
var id=$(this).attr('data-atributo');
$('#'+id).addClass('efecto');
$('#'+id).html('precios de locura descuentos hasta de 70%');
});
$('button').on('mouseleave',function(event){
var id=$(this).attr('data-atributo');
$('parent#'+id).removeClass('efecto');
$('#'+id).empty();
});
});
</script>
Gracias!!