diff --git a/js/big-picture.js b/js/big-picture.js
index 91e2caa..27d0859 100644
--- a/js/big-picture.js
+++ b/js/big-picture.js
@@ -1,13 +1,16 @@
 import { isEscapeKey } from './util.js';
 
+const COMMENTS_STEP = 5;
 const bigPictureElement = document.querySelector('.big-picture');
 const bodyElement = document.querySelector('body');
-const commentCountElement = bigPictureElement.querySelector('.social__comment-count');
 const commentListElement = bigPictureElement.querySelector('.social__comments');
-const commentsLoaderElement = bigPictureElement.querySelector('.comments-loader');
+const commentsLoader = document.querySelector('.comments-loader');
 const cancelButtonElement = bigPictureElement.querySelector('.big-picture__cancel');
 const liElement = commentListElement.querySelector('li');
 
+let currentCount = 0;
+let comments = [];
+
 const createComment = ({ avatar, message, name}) => {
   const comment = liElement.cloneNode(true);
 
@@ -18,16 +21,30 @@ const createComment = ({ avatar, message, name}) => {
   return comment;
 };
 
-const showComments = (comments) => {
-  commentListElement.innerHTML = '';
+const showComments = () => {
+  currentCount += COMMENTS_STEP;
+  if (currentCount >= comments.length) {
+    commentsLoader.classList.add('hidden');
+    currentCount = comments.length;
+  } else {
+    commentsLoader.classList.remove('hidden');
+  }
 
   const fragment = document.createDocumentFragment();
-  comments.forEach ((item) => {
-    const comment = createComment(item);
+  for (let i = 0; i < currentCount; i++) {
+    const comment = createComment(comments[i]);
     fragment.append(comment);
-  });
+  }
 
+  commentListElement.innerHTML = '';
   commentListElement.append(fragment);
+  bigPictureElement.querySelector('.social__comment-count').innerHTML =
+  `${currentCount} из <span class="comments-count">${comments.length}</span> комментариев`;
+
+};
+
+const onCommentsLoaderClick = () => {
+  showComments(comments);
 };
 
 const onDocumentKeydown = (evt) => {
@@ -41,6 +58,7 @@ function hideBigPicture () {
   bigPictureElement.classList.add('hidden');
   bodyElement.classList.remove('modal-open');
   document.removeEventListener('keydown', onDocumentKeydown);
+  currentCount = 0;
 }
 
 const onCancelButtonClick = () => {
@@ -56,14 +74,17 @@ const showPictureDetails = ({ url, likes, description }) => {
 const showBigPicture = (data) => {
   bigPictureElement.classList.remove('hidden');
   bodyElement.classList.add('modal-open');
-  commentsLoaderElement.classList.add('hidden');
-  commentCountElement.classList.add('hidden');
+  commentsLoader.classList.add('hidden');
   document.addEventListener('keydown', onDocumentKeydown);
 
   showPictureDetails(data);
-  showComments(data.comments);
+  comments = data.comments;
+  if (comments.length >= 0) {
+    showComments(comments);
+  }
 };
 
 cancelButtonElement.addEventListener('click', onCancelButtonClick);
+commentsLoader.addEventListener('click', onCommentsLoaderClick);
 
 export { showBigPicture };