Сделал скрипт отображения галереи - тормозит жутко
Не подскажите как можно оптимизировать его?
Где слабое место?
<div id="modal100">
<p id="image-insert"><img id="big-foto"></p>
</div>
<div id="large">
<a class="jea_modal" href="<?php echo $mainImage->URL ?>" >
<img
src="<?php echo $mainImage->mediumURL ?>"
id="jea-preview-img"
alt="<?php echo $mainImage->title ?>"
title="<?php echo $mainImage->description ?>"
/>
</a>
</div>
<ul id="thumbnail">
<?php foreach ($this->row->images as $image) : ?>
<li >
<a class="gallery-min" href="<?php echo $image->mediumURL ?>" name="<?php echo $image->URL ?>">
<img class="" src="<?php echo $image->minURL ?>" alt="<?php echo $image->title ?>" title="<?php echo $image->description ?>"/>
</a>
</li>
<?php endforeach ?>
</ul>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery("#thumbnail a.gallery-min").click(function (e) {
e.preventDefault();
var getHref = jQuery(this).attr("href");
var getSrc = jQuery(this).attr("name");
jQuery("#large img").attr({"src": getHref});
jQuery("#large a.jea_modal").attr({"href": getSrc});
//console.log(getSrc);
});
jQuery("#large a.jea_modal").click(function (ei) {
ei.preventDefault();
var getHref = jQuery(this).attr("href");
jQuery("#image-insert img#big-foto").attr({"src": getHref});
setTimeout(function () {
jQuery("#modal100").show().delay(2000);
var widthPhoto = jQuery('img#big-foto').width();
var widthParent = jQuery('#image-insert').width();
var calcWidth = (widthParent - widthPhoto) / 2;
var heightPhoto = jQuery('img#big-foto').height();
var heightParent = jQuery('div#modal100').height();
var calcHeight = (heightParent - heightPhoto) / 2;
console.log(heightParent);
console.log(heightPhoto);
jQuery('img#big-foto').css({'position': 'absolute', 'margin-left': calcWidth, 'margin-right': calcWidth, 'margin-top': calcHeight, 'margin-bottom': calcHeight});
}, 500);
});
jQuery("#modal100").click(function () {
jQuery(this).hide();
});
});
</script>