what's the number of times the letter "t" appears in:
q: простая анимация при изменение содержимого блока (css)? имеется .wrapper состоящий из .item, по событию будут удаляться, либо добавляться новые .item. высота и ширина .wrapper изначально не известна.
как реализовать следующую анимацию:


*

*при изменение количества .item, размер .wrapper должен плавно увеличиваться.

*спустя 0.5s после увеличения .wrapper, должны плавно появиться .item.


хочу наглядно понять, как правильно писать подобного рода анимации.


.wrapper
{
  background: orange;
}
<div class="wrapper">
  <div class="item">item1</div>
  <div class="item">item2</div>
  <div class="item">item3</div>
</div>



a: 

var btn = document.getelementbyid("elem");
var wrapper = document.getelementbyid("wrapper");
wrapper.addeventlistener("transitionend", setopacity);
btn.addeventlistener("click", go);

function  go(event){
var valuechild = 5;
var height = valuechild * 200;
wrapper.style.height = height +"px";
for (var i=0; i<valuechild; i++){
 var div = document.createelement("div");
 div.classname = "item";
 div.innertext = "item"+i;
 wrapper.appendchild(div);
}
}

function setopacity() {
settimeout(function(){
var child = wrapper.children;
for (var i=0; i<child.length; i++){
 child[i].style.opacity = "1";
}
},500)
}t
#wrapper{
width: 200px;
background: blue;
height: 0px;
transition: 4s;
overflow: hidden;
}
.item{
color: yellow;
border: 1px solid;
width: 200px;
height: 200px;
opacity: 0;
transition: 3s;
}
<button id="elem">клик</button> 

<div id="wrapper" class="wrapper"></div>



user
There are 64 "t"s in the text you provided.
assistant