ちょっとコミュニティは、フレーム内の写真のこのセンタリングを行っているので、そのサイズに関係なく、画像の中心がフレームの中心にあります。(枠は固定です)
$('.item-box').each(function () {
var fwidth = $('.gmask').width();
var iwidth = $('.gmask img').width();
var fheight = $('.gmask').height();
var iheight = $('.gmask img').height();
$('.gmask img').css('margin-left', Math.floor((fwidth - iwidth) / 2) - 3);
$('.gmask img').css('margin-top', Math.floor((fheight - iheight) / 2) - 3);
});
「.item-box」ごとにこれをループとして実行したいのですが、何が間違っているのか誰か教えてください。
*編集
ところで私はjqueryテンプレートをやっています
<script id="resultTemplate" type="text/x-jquery-tmpl ">
{{for Product}}
<div class="item-box" id="{{if #index < 5 }}itemboxTeaser{{else}}itemboxRest{{/if}}{{:#index+1}}">
<div class="visual-gallery">
<div class="gmask">
<ul class="replaceClass">
<a href="/lejemaal/{{:Urlname}}/#/Lejemaal">
<img src="{{:PhysicalPathToFrontPhotoUseWebFront300Px}}" alt="">
</a>
</ul>
</div>
</div>
</div>
{{/for}}
</script>