Показать сообщение отдельно
  #24 (permalink)  
Старый 18.11.2014, 15:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,072

misterX_,

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
  <script>
      $(function() {
            var $img = $("#photoContainer img"),
                $large = $('#largeImage');
            $large.load(function() {
                $large.fadeIn("slow")
            })
            $img.click(function() {
                var src = this.src.replace('thumb', 'lg');
                new Image().src = src;
                $large.fadeOut("slow", function() {
                    this.src = src;
this.complete && $(this).load()
                })
            });
        });
  </script>
</head>

<body>
  <div id="photoContainer">
  <img src="https://js.cx/gallery/img2-thumb.jpg">
  <img src="https://js.cx/gallery/img3-thumb.jpg">
  <img src="https://js.cx/gallery/img4-thumb.jpg">
  <img src="https://js.cx/gallery/img5-thumb.jpg">
  <img src="https://js.cx/gallery/img6-thumb.jpg">
  </div>
  <img src="https://js.cx/gallery/img2-lg.jpg" id="largeImage">
</body>
</html>

Последний раз редактировалось рони, 01.03.2018 в 15:51.
Ответить с цитированием