Показать сообщение отдельно
  #12 (permalink)  
Старый 27.05.2022, 08:50
Аспирант
Отправить личное сообщение для Дмитрий Луценко Посмотреть профиль Найти все сообщения от Дмитрий Луценко
 
Регистрация: 24.05.2022
Сообщений: 36

Может быть так? Обработка ведется как в тегах абзаца, так и без них, плюс первый символ каждого контейнера about-content-1 оборачивается span c классом, который может быть стилизирован обычным css
<div class="about-content-1"><p>135232614qsfw523rdt235dg3456</p></div>
<div class="about-content-1">13sgsfj4qsfw523rdt235dg3456</div>
<div class="about-content-1">135232615dfj73253456</div>
<script>
const typing = document.querySelectorAll('.about-content-1, .about-content-1 *');

function type(element) {

function randomOpacity() {
  return (Math.floor(Math.random() * 50) + 50)/100;
}

function randomEms() {
  if (Math.random() > .8) {
  return (Math.floor(Math.random() * 100) - 50)/800;
  }
  else {
    return 0;
  }
}

function wrap(char,i) { // попытка исключить из обработки первый символ
   if( i === 0 ) return '<span class="dont-touch">'+char+'</span>'; 
   return '<span style="opacity:' + randomOpacity() + '; text-shadow:' + randomEms() + 'em ' + randomEms() + 'em currentColor;">' + char + '</span>';
}


const wrappedText = Array.from(element.textContent).map(wrap);

element.innerHTML = wrappedText.join('');
  
}

typing.forEach(type);
</script>
Ответить с цитированием