Проблема с ползунком jQuery, платформа sharepoint

Question

Я создаю веб-часть для отображения опознавательных сообщений, отправленных в мой офис.Проблема, с которой я столкнулся, заключается в том, что jQuery Pull начинает затухать, отображая «слайд» при загрузке следующих 2, затемняя 2 и показывая 3.

public render(): React.ReactElement<IRecognitionFeedProps> {

  jQuery(document).ready(function(){
    jQuery(function(){

      jQuery('#reconcontainer > div:gt(0)').hide();
      setInterval(function(){
        jQuery('#reconcontainer > div:first-child')
        .fadeOut(2000)
        .next('div')
        .fadeIn(2000)
        .end()
        .appendTo('#reconcontainer');
      }, 7000);
    });
  });

return (
  <div className={styles.recognitionFeed}>
    <div className={ styles.container } id="reconcontainer">
      {this.state.items.map(function(item,key){
        return (

        <div className={styles.Recognition} key={key} >
            <section className={styles.Name}>&nbsp;<strong>{item.Title}&nbsp;{item.LastName} </strong></section>
            <section className={styles.Date}>{item.AwardDate.substring(5, item.AwardDate.length-10) }</section>
            <section className={styles.Comment}>{item.Comment}</section>
            <section className={styles.SubmitterName}>-<strong>{item.SubmitterFirstName}&nbsp;{item.SubmitterLastName} </strong></section>
        </div> )
      })}
    </div>
  </div>
);
}

Экран 1/2 исчезает и 3 исчезает, введите изображениеописание здесь Это может помочь, это из инструментов разработчика, наблюдающих, как 1/2 сдвигает дно и 3 нагрузки.