console
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,viewport-fit=cover">
<style>
*{
margin:0;
padding:0;
}
body{
background: green;
}
</style>
<p style="opacity:0">.</p>
<section style="height:0;display:block;">
<svg height="600px" style="width:100%" viewBox="0 0 375 600" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" style="fill:#000;width:375px;height:600px;"></rect>
<g>
<animate attributename="opacity" values="0;1;0" dur="1s" repeatCount="indefinite" calcMode="discrete"></animate>
<text x="25" y="500" style="opacity:1;fill:#fff;font-size:160px;">大事</text>
</g>
<g>
<text x="224" y="145" style="fill:#fff;font-size:12px;">点击查看大事</text>
</g>
<g>
<animate attributeName="opacity" begin="0" values="0;1;0" repeatCount="indefinite" fill="freeze" dur="2s"></animate>
<path fill="#ffffff" d="m259.306611,169.792738a14.799771,15.180578 0 1 0 14.799771,15.180578a14.807171,15.188168 0 0 0 -14.799771,-15.180578zm0,29.096107a13.566457,13.91553 0 1 1 13.566457,-13.91553a13.572624,13.921855 0 0 1 -13.566457,13.91553z"></path>
<path fill="#ffffff" d="m258.863775,191.321296l-6.699727,-5.750115l-1.312171,0.847293l8.902108,7.613163l8.902108,-7.626889l-1.340658,-0.831071l-6.67124,5.745124l0,-14.757132l-1.780421,0l0,14.759628z"></path>
</g>
</svg>
</section>
<section style="pointer-events: none;">
<svg height="200px" preserveAspectRatio="xMidYMin meet" style="width:100%" xmlns="http://www.w3.org/2000/svg">
<animate attributename="height" fill="freeze" restart="never" values="82;82;82" dur="600ms" begin="touchstart" calcMode="spline" keySplines="0.42 0 0.58 1.0; 0.42 0 0.58 1.0" ></animate>
<animate attributename="height" fill="freeze" restart="never" values="82;600;600" dur="600ms" begin="touchstart+1s" calcMode="spline" keySplines="0.42 0 0.58 1.0; 0.42 0 0.58 1.0"></animate>
<rect x="245" y="170" style="pointer-events:visible;opacity:0;fill:#fff;width:30px;height:30px;"></rect>
</svg>
</section>