JSFiddle - React, Tailwind, and code Playground

by olegcvetkov76

HTML

<div id="app" @scroll="letsScroll = true" :class="letsScroll && '_scrolled'">
  <span class="some_content">
    Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов. Lorem Ipsum не только успешно пережил без заметных изменений пять веков, но и перешагнул в электронный дизайн. Его популяризации в новое время послужили публикация листов Letraset с образцами Lorem Ipsum в 60-х годах и, в более недавнее время, программы электронной вёрстки типа Aldus PageMaker, в шаблонах которых используется Lorem Ipsum.
  </span>
</div>

CSS

#app {
  height: 100px;
  color: #333;
  overflow: auto;
}

#app._scrolled {
  color: red;
}

JavaScript

new Vue({
  el: '#app',
  data: {
  	letsScroll: false
  }
})