Показать сообщение отдельно
  #1 (permalink)  
Старый 24.11.2014, 11:23
Аспирант
Отправить личное сообщение для alexmixaylov Посмотреть профиль Найти все сообщения от alexmixaylov
 
Регистрация: 14.09.2013
Сообщений: 70

Сделал скрипт отображения галереи - тормозит жутко
Сделал скрипт отображения галереи - тормозит жутко
Не подскажите как можно оптимизировать его?
Где слабое место?

<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>
Ответить с цитированием