Hola mayco,
si funcionar funciona tal cual, de hecho el primer elemento h3 contenido en el primer div se centra correctamente en función de su height, pero el resto ya no.
Tengo la siguiente estructura en HTML:
Código PHP:
<li class="work-item graphic ">
<figure><a href="#" title="SEO KEYWORDS"><img src="images/samples/work-01.jpg" width="160" height="160" alt="Banner for CSNYC" /></a></figure>
<div class="work-caption">
<h3><a class="caption-title zoom" href="images/samples/works-big/illustrativelettering_880.png" rel="graphic-gallery" title="Work for NY">Banner illustration for Crative Studios NYC</a></h3>
</div>
</li>
Y lo siguiente en jquery:
Código PHP:
var wrapper = $(".work-caption");
var theItem =$(".work-caption h3");
var contHeight=$(wrapper).height();
var contMiddle=contHeight/2;
var titleMiddle=$(".work-caption h3").height()/2;
var theMiddle=contMiddle-titleMiddle;
$(".work-caption h3").each(function(){
if(contHeight>$(this).height()){ //vertical
$(this).css('margin-top',theMiddle);
} else {
$(this).css('margin-top','0');
}
});
alert(contHeight);
alert(contMiddle);
alert(theMiddle);
Con esta función, como digo, consigo centrar solo el primero de los h3 y necesito que lo haga en todos, tengo uno por cada trabajo en el portfolio. Unos 45-50 items, entonces mi duda es acerca de la función de jquery.
Cómo puedo matizarla para que se aplique a todos.
Muchas gracias de todos modos!! :)