Ver Mensaje Individual
  #17 (permalink)  
Antiguo 04/05/2015, 21:47
annmancgraf
 
Fecha de Ingreso: abril-2015
Mensajes: 16
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Cambio de color de imagen en hover

<link rel="stylesheet" href="magnificpopup/magnificpopup.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="magnificpopup/jquerymagnificpopupmin.js"></script>

</head>

<body id="azul">
<div id="contenedor4">
<div id="menu">
<ul>
<li id="diferente">Arquitecto Pepe Peña</li>
<li><a class="blue" href="index.html"> INICIO </a></li>
<li><a class="blue"href="bio.html"> BIO </a></li>
<li><a class="blue"href="#"> PROYECTOS </a>
<ul>
<li class="submenu1"><a class="negroazul" href="residencias.html">RESIDENCIAS</a></li>
<li class="submenu1"><a class="negroazul" href="#">EDIFICIOS</a></li>
<li class="submenu1"><a class="negroazul" href="#">CHACRAS</a></li>
<li class="submenu1"><a class="negroazul" href="#">LOCALES COMERCIALES</a></li>
</ul>
</li>
<li><a class="blue"href="contacto.html"> CONTACTO </a></li>
</ul>
</div>
</div>
<div id="galeria">
<script>
$(document).ready(function() {
$('#galeria').magnificPopup({
delegate: 'a',
type: 'image',
tLoading: 'Cargando imagen #%curr%...',
mainClass: 'mfp-img-mobile',
gallery: {
enabled: true,
navigateByImgClick: true,
preload: [0,1] // Will preload 0 - before current, and 1 after the current image
},
image: {
tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
}
});
});
</script>
<a class="bluecircle" href="imagenes/1grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/1full.png"/>
</a>

<a class="bluecircle" href="imagenes/2grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/2full.png"/>
</a>

<a class="bluecircle" href="imagenes/3grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/3full.png"/>
</a>

<a class="bluecircle" href="imagenes/4grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/4full.png"/>
</a>
<a class="bluecircle" href="imagenes/5grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/5full.png"/>
</a>

<a class="bluecircle" href="imagenes/6grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/6full.png"/>
</a>

<a class="bluecircle" href="imagenes/7grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/7full.png"/>
</a>

<a class="bluecircle" href="imagenes/8grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/8full.png"/>
</a>

<a class="bluecircle" href="imagenes/9grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/9full.png"/>
</a>

<a class="bluecircle" href="imagenes/10grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/10full.png"/>
</a>
<a class="bluecircle" href="imagenes/11grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/11full.png"/>
</a>

<a class="bluecircle" href="imagenes/12grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/12full.png"/>
</a>
<a class="bluecircle" href="imagenes/13grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/13full.png"/>
</a>
<a class="bluecircle" href="imagenes/14grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/14full.png"/>
</a>
<a class="bluecircle" href="imagenes/15grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/15full.png"/>
</a>
<a class="bluecircle" href="imagenes/16grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/16full.png"/>
</a>
<a class="bluecircle" href="imagenes/17grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/17full.png"/>
</a>
<a class="bluecircle" href="imagenes/18grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/18full.png"/>
</a>

<a class="bluecircle" href="imagenes/19grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/19full.png"/>
</a>
<a class="bluecircle" href="imagenes/20grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/20full.png"/>
</a>
<a class="bluecircle" href="imagenes/21grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/21full.png"/>
</a>
<a class="bluecircle" href="imagenes/22grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/22full.png"/>
</a>
<a class="bluecircle" href="imagenes/23grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/23full.png"/>
</a>
<a class="bluecircle" href="imagenes/24grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/24full.png"/>
</a>
<a class="bluecircle" href="imagenes/25grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/25full.png"/>
</a>
<a class="bluecircle" href="imagenes/26grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/26full.png"/>
</a>
<a class="bluecircle" href="imagenes/27grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/27full.png"/>
</a>
<a class="bluecircle" href="imagenes/28grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/28full.png"/>
</a>
<a class="bluecircle" href="imagenes/29grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/29full.png"/>
</a>
<a class="bluecircle" href="imagenes/30grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/30full.png"/>
</a>
<a class="bluecircle" href="imagenes/31grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/31full.png"/>
</a>
<a class="bluecircle" href="imagenes/32grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/32full.png"/>
</a>
<a class="bluecircle" href="imagenes/33grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/33full.png"/>
</a>
<a class="bluecircle" href="imagenes/34grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/34full.png"/>
</a>
<a class="bluecircle" href="imagenes/35grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/35full.png"/>
</a>
<a class="bluecircle" href="imagenes/36grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/36full.png"/>
</a>
<a class="bluecircle" href="imagenes/37grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/37full.png"/>
</a>
<a class="bluecircle" href="imagenes/38grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/38full.png"/>
</a>
<a class="bluecircle" href="imagenes/39grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/39full.png"/>
</a>
<a class="bluecircle" href="imagenes/40grande.jpg">
<img width="150px" height="150px" src="circulosdecolor/40full.png"/>
</a>
</div>

</body>
</html>