<script  type="text/javascript">
$(document).ready(function() {
	$('#actividad1').hover(
		function(){
			$('#actividad1 img').attr('src', '/system/application/views/images/menu_padel2.png');
		},
		function(){
			$('#actividad1 img').attr('src', '/system/application/views/images/menu_padel.png');
		}
	);
	$('#actividad2').hover(
		function(){
			$('#actividad2 img').attr('src', '/system/application/views/images/menu_basket2.png');
		},
		function(){
			$('#actividad2 img').attr('src', '/system/application/views/images/menu_basket.png');
		}
	);
	$('#actividad3').hover(
		function(){
			$('#actividad3 img').attr('src', '/system/application/views/images/menu_sala2.png');
		},
		function(){
			$('#actividad3 img').attr('src', '/system/application/views/images/menu_sala.png');
		}
	);	

});	

</script>

<?php
		if ($actividades->num_rows() > 0){
			
			foreach ($actividades->result() as $actividad):
			
				 if ($actividad_seleccionada == $actividad->id)
				      $clase = 'class="actividad seleccionado"';
				 else
				 	  $clase = 'class="actividad"';
				 echo '<div '. $clase .'> 
							<a id="actividad'.$actividad->id.'" href="" onclick="mostrar_actividad('.$actividad->id.',0,0); mostrar_menu('.$actividad->id.');  return false;">
								<img class="imagen-actividad" src="/system/application/views/images/menu_'.$actividad->nombre.'.png" alt="'.$actividad->nombre.'">
								<span class="enlace-actividad">'.$actividad->nombre.'</span>
							</a>
						</div>';
			endforeach;
		}
?>