Оптимизация галереи для сайта

217
25 мая 2017, 08:05

Здравствуйте.

Возникла проблема с галереей на сайте, а именно показом больших изображений. Когда сайт загрузился первый раз, то при нажатии на превью в панели, большое изображение появляется с задержкой, точнее говоря, сначала показывается то, которое уже выбрано до клика на превью, а потом с неким рывком появляется уже нужное, так со всеми изображениями до тех пор, пока все превью не были открыты хотя бы по одному разу, далее уже все работает ровно и плавно.

Демо

$('#thumbs').delegate('img','click', function(){ $('#largeImage').attr('src',$(this).attr('src').replace('thumb','large')); 
$('#largeImage').css("transition" , "none"); $('#largeImage').css("opacity" , "0"); $('#description').html($(this).attr('alt')); 
setTimeout(function(){ two(); 
}, 300); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="gallery-section" id="pictures">  
  <div class="container">  
    <div id="gallery">  
    <div id="panel">  
      <img id="largeImage" src="img/gallery1_large.jpg" />  
      <div id="description">1st image description</div>  
    </div>  
 
  <div id="thumbs">  
    <img src="img/gallery1_thumb.jpg" alt="1st image description" />  
    <img src="img/gallery2_thumb.jpg" alt="2nd image description" />  
    <img src="img/gallery3_thumb.jpg" alt="3rd image description" />  
    <img src="img/gallery4_thumb.jpg" alt="4th image description" />  
    <img src="img/gallery5_thumb.jpg" alt="5th image description" />  
    <img src="img/gallery6_thumb.jpg" alt="6th image description" />  
  </div>  
  </div>  
  </div>  
</div>

READ ALSO
Блочные элементы в 3 колонки

Блочные элементы в 3 колонки

Есть набор блочный элементов с разной высотойКак можно разместить их в 3 колонки, чтоб направление блоков было сверху вниз и блоки равномерно...

259
Не знаю как и где применять знания

Не знаю как и где применять знания

Я могу сказать что всё что я делал это тратил своё время на фигню которая мне в жизни ничего не дала, за последние 2 года, я перегорел больше...

316
Как вывести одно слово в виде ссылки?

Как вывести одно слово в виде ссылки?

Добрый день всем! Подскажите пожалуйста, есть строка вида: "слово 1, слово 2"

223
Верстка списка в несколько колонок

Верстка списка в несколько колонок

Есть список (должен быть именно сплошной список без разделений на колонки):

398