如何在 JavaScript 或 CSS 中制作文本影片效果、Hello World 到 HW？
第一個文本是Hello World！最后，成為HW，其他字母消失。
你好世界！
↓
地獄世界！
↓
他太棒了！
↓
硬體
uj5u.com熱心網友回復：
在此處輸入影像描述
<script>
export default {
name:"Introduction",
data() {
return {
timer:1,
}
},
mounted() {
this.deathLoop = null
this.deathLoop = setInterval(()=>{
this.timer =1
if(this.timer>4) this.timer=1
},1000)
},
}
</script><style scoped>
.Introduction{
padding-top: 60px;
height: 100%;
width: 100%;
color: #333;
font-size: 20px;
}
span{
font-size: 30px;
height: 20px;
line-height: 20px;
margin-top: 10px;
}
</style><template>
<div class="Introduction">
<span >H</span>
<span v-show="timer<4">e</span>
<span v-show="timer<3">l</span>
<span v-show="timer<3">l</span>
<span v-show="timer<2">o</span>
<span> </span>
<span >W</span>
<span v-show="timer<3">o</span>
<span v-show="timer<3">r</span>
<span v-show="timer<4">l</span>
<span v-show="timer<4">d</span>
<span v-show="timer<4">!</span>
</div>
</template>檢查影像。也許這就是你想要的。Vue.js2 的代碼，你可以用純 Javascript 復制它
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/467758.html
標籤：javascript css 动画片