mawenzi+1
From screenshot I see that image itsefl viewed with opasity (maybe) 50 %
I did something for myself, but quite the contrary - I have normaly viewed thumbnail, and made it to get opaque %50 on mouseover.
.thumb a:hover img {
filter:alpha(opacity=50);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
opacity:0.5;
after some test you can make as you wish, to get opaque image normally, exactly on the contrary of what I did.
But I think it is not good for gallery view, imho.
-------------------------------------------------------------------------------------------------------
---- added after a while ))) I got interested and did it for you right now )) ---------
add to the end in styles.css
.thumb img {
filter:alpha(opacity=50);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
opacity:0.5;
}
.thumb a:hover img {
filter:alpha(opacity=90);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);
opacity:0.9;
}
and give/add to your {thumbnail} or {image} div's class "thumb":
<div class="thumb">{thumbnail}</div>
example on thumbnails you can see
here.
But if you want to do exactly as on screenshot - taking effects mentioned above only on a square area in the image, you mustl use .js. Only with div you cannot do it.
I don't want in my site many javascrips, so will not test. I give you an attachaed file instead, after a few testing yuou will be able change code as you like. Attached file contains javascript which make zoon in square area, as you want to not to zoom but bland, so you are free to test it )) see attached file below.